使用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 相关文章推荐
JCalendar 日历控件 v1.0 beta[兼容IE&amp;Firefox] 有文档和例子
May 30 Javascript
如何在指定的地方插入html内容和文本内容
Dec 23 Javascript
从零学JS之你需要了解的几本书
May 19 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 Javascript
js限制input标签中只能输入中文
Jun 26 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
详解Angularjs在控制器(controller.js)中使用过滤器($filter)格式化日期/时间实例
Feb 17 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
May 22 Javascript
vue中的provide/inject的学习使用
May 09 Javascript
Vue中实现权限控制的方法示例
Jun 07 Javascript
react-intl实现React国际化多语言的方法
Sep 27 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
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
PHP array_flip() 删除重复数组元素专用函数
2010/05/16 PHP
YII框架批量插入数据的方法
2017/03/18 PHP
CI(CodeIgniter)框架中URL特殊字符处理与SQL注入隐患分析
2019/02/28 PHP
网页和浏览器兼容性问题汇总(draft1)
2009/06/01 Javascript
JQuery优缺点分析说明
2010/06/09 Javascript
jquery实现excel导出的方法
2013/04/04 Javascript
javascript获取当前鼠标坐标的方法
2015/01/10 Javascript
使用jquery操作session方法分享
2015/01/22 Javascript
javascript数组随机排序实例分析
2015/07/22 Javascript
jquery实现的点击翻书效果代码
2015/11/04 Javascript
jQuery插件formValidator自定义函数扩展功能实例详解
2015/11/25 Javascript
分享jQuery封装好的一些常用操作
2016/07/28 Javascript
jQuery和JavaScript节点插入元素的方法对比
2016/11/18 Javascript
ES6使用let命令更简单的实现块级作用域实例分析
2017/03/31 Javascript
详谈构造函数加括号与不加括号的区别
2017/10/26 Javascript
vue.js select下拉框绑定和取值方法
2018/03/03 Javascript
微信小程序页面间跳转传参方式总结
2019/06/13 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
2019/09/27 Javascript
浅谈layui 表单元素的选中问题
2019/10/25 Javascript
element-ui 实现响应式导航栏的示例代码
2020/05/08 Javascript
vue 获取到数据但却渲染不到页面上的解决方法
2020/11/19 Vue.js
[51:43]OG vs LGD 2018国际邀请赛淘汰赛BO3 第五场 8.26
2018/08/30 DOTA
调试Python程序代码的几种方法总结
2015/04/28 Python
python引入导入自定义模块和外部文件的实例
2017/07/24 Python
python针对excel的操作技巧
2018/03/13 Python
Python发展史及网络爬虫
2019/06/19 Python
django框架CSRF防护原理与用法分析
2019/07/22 Python
Python读取pdf表格写入excel的方法
2021/01/22 Python
CSS3制作圆形滚动进度条动画的示例
2020/11/05 HTML / CSS
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
德国baby-markt婴儿用品瑞士网站:baby-markt.ch
2017/06/09 全球购物
英国地毯卖家:The Rug Seller
2019/07/18 全球购物
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
党员干部形式主义个人整改措施
2014/09/17 职场文书
感恩信:写给爸爸妈妈的一封感谢信
2019/09/12 职场文书
Vue全局事件总线你了解吗
2022/02/24 Vue.js