使用JQuery进行跨域请求


Posted in Javascript onJanuary 25, 2010
以上程序是今天偶然看到的,分享一下!
原文地址:  Cross-domain-request-with-jquery
当然,还有以上的那个 Demo,我直接拿过来改了下,原地址:Demo

$(document).ready(function(){ 
var container = $('#target'); 
container.attr('tabIndex','-1'); 
$('.ajaxtrigger').click(function(){ 
var trigger = $(this); 
var url = trigger.attr('href'); 
if(!trigger.hasClass('loaded')){ 
trigger.append('<span></span>'); 
trigger.addClass('loaded'); 
var msg = trigger.find('span::last'); 
} else { 
var msg = trigger.find('span::last'); 
} 
doAjax(url,msg,container); 
return false; 
}); function doAjax(url,msg,container){ 
// if the URL starts with http 
if(url.match('^http')){ 
// assemble the YQL call 
msg.removeClass('error'); 
msg.html(' (loading...)'); 
$.getJSON("http://query.yahooapis.com/v1/public/yql?"+ 
"q=select%20*%20from%20html%20where%20url%3D%22"+ 
encodeURIComponent(url)+ 
"%22&format=xml'&callback=?", 
function(data){ 
if(data.results[0]){ 
var data = filterData(data.results[0]); 
msg.html(' (ready.)'); 
container. 
html(data). 
focus(). 
effect("highlight",{},1000); 
} else { 
msg.html(' (error!)'); 
msg.addClass('error'); 
var errormsg = '<p>Error: could not load the page.</p>'; 
container. 
html(errormsg). 
focus(). 
effect('highlight',{color:'#c00'},1000); 
} 
} 
); 
} else { 
$.ajax({ 
url: url, 
timeout:5000, 
success: function(data){ 
msg.html(' (ready.)'); 
container. 
html(data). 
focus(). 
effect("highlight",{},1000); 
}, 
error: function(req,error){ 
msg.html(' (error!)'); 
msg.addClass('error'); 
if(error === 'error'){error = req.statusText;} 
var errormsg = 'There was a communication error: '+error; 
container. 
html(errormsg). 
focus(). 
effect('highlight',{color:'#c00'},1000); 
}, 
beforeSend: function(data){ 
msg.removeClass('error'); 
msg.html(' (loading...)'); 
} 
}); 
} 
} 
function filterData(data){ 
// filter all the nasties out 
// no body tags 
data = data.replace(/<?\/body[^>]*>/g,''); 
// no linebreaks 
data = data.replace(/[\r|\n]+/g,''); 
// no comments 
data = data.replace(/<--[\S\s]*?-->/g,''); 
// no noscript blocks 
data = data.replace(/<noscript[^>]*>[\S\s]*?<\/noscript>/g,''); 
// no script blocks 
data = data.replace(/<script[^>]*>[\S\s]*?<\/script>/g,''); 
// no self closing scripts 
data = data.replace(/<script.*\/>/,''); 
// [... add as needed ...] 
return data; 
} 
});
Javascript 相关文章推荐
js冒泡、捕获事件及阻止冒泡方法详细总结
May 08 Javascript
JQuery实现的购物车功能(可以减少或者添加商品并自动计算价格)
Jan 13 Javascript
理解javascript中的MVC模式
Jan 28 Javascript
Mobile Web开发基础之四--处理手机设备的横竖屏问题
Aug 11 Javascript
JavaScript数组的5种迭代方法
Sep 29 Javascript
微信小程序实现给嵌套template模板传递数据的方式总结
Dec 18 Javascript
node结合swig渲染摸板的方法
Apr 11 Javascript
vue 国际化 vue-i18n 双语言 语言包
Jun 07 Javascript
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
Dec 09 Javascript
玩转Koa之核心原理分析
Dec 29 Javascript
JavaScript ES6箭头函数使用指南
Dec 30 Javascript
JS document form表单元素操作完整示例
Jan 13 Javascript
javascript 的Document属性和方法集合
Jan 25 #Javascript
起点页面传值js,有空研究学习下
Jan 25 #Javascript
js 巧妙去除数组中的重复项
Jan 25 #Javascript
将函数的实际参数转换成数组的方法
Jan 25 #Javascript
javascript中利用数组实现的循环队列代码
Jan 24 #Javascript
document.getElementById为空或不是对象的解决方法
Jan 24 #Javascript
JavaScript 未结束的字符串常量常见解决方法
Jan 24 #Javascript
You might like
Yii框架关联查询with用法分析
2014/12/02 PHP
Yii使用技巧大汇总
2015/12/29 PHP
PHP7新增运算符用法实例分析
2016/09/26 PHP
php解析base64数据生成图片的方法
2016/12/06 PHP
php使用ftp实现文件上传与下载功能
2017/07/21 PHP
jquery 弹出登录窗口实现代码
2009/12/24 Javascript
JavaScript 学习笔记(五)
2009/12/31 Javascript
验证javascript中Object和Function的关系的三段简单代码
2010/06/27 Javascript
初学js插入节点appendChild insertBefore使用方法
2011/07/04 Javascript
jquery全选/全不选/反选另一种实现方法(配合原生js)
2013/04/07 Javascript
javascript弹出层输入框(示例代码)
2013/12/11 Javascript
深入理解JavaScript是如何实现继承的
2013/12/12 Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
2014/09/04 Javascript
javascript+canvas制作九宫格小程序
2014/12/28 Javascript
Javascript 拖拽的一些简单的应用(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
JavaScript获得表单target属性的方法
2015/04/02 Javascript
easyui Draggable组件实现拖动效果
2015/08/19 Javascript
浅谈window.onbeforeunload() 事件调用ajax
2016/06/29 Javascript
浅谈Angularjs link和compile的使用区别
2016/10/21 Javascript
canvas 弹幕效果(实例分享)
2017/01/11 Javascript
AngularJS表单提交实例详解
2017/02/18 Javascript
vue + vuex todolist的实现示例代码
2018/03/09 Javascript
JS实现table表格内针对某列内容进行即时搜索筛选功能
2018/05/11 Javascript
javascript数据类型中的一些小知识点(推荐)
2019/04/18 Javascript
Vue.js实现大转盘抽奖总结及实现思路
2019/10/09 Javascript
vue中 数字相加为字串转化为数值的例子
2019/11/07 Javascript
python实现读取并显示图片的两种方法
2017/01/13 Python
python实现年会抽奖程序
2019/01/22 Python
Python 50行爬虫抓取并处理图灵书目过程详解
2019/09/20 Python
Python jieba库分词模式实例用法
2021/01/13 Python
html5中如何将图片的绝对路径转换成文件对象
2018/01/11 HTML / CSS
经济实惠的豪华家具:My-Furniture
2019/03/12 全球购物
英国户外服装、鞋类和设备的领先零售商:Millets
2020/10/12 全球购物
Javascript如何发送一个Ajax请求
2015/01/26 面试题
2014年高考决心书
2014/03/11 职场文书
Pytorch可视化的几种实现方法
2021/06/10 Python