使用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 相关文章推荐
JQuery中$.ajax()方法参数详解及应用
Dec 12 Javascript
js创建对象的方式总结
Jan 10 Javascript
Jquery Ajax xmlhttp请求成功问题
Feb 04 Javascript
js实现交换运动效果的方法
Apr 10 Javascript
JavaScript 消息框效果【实现代码】
Apr 27 Javascript
Vue 父子组件、组件间通信
Mar 08 Javascript
几种响应式文字详解
May 19 Javascript
seajs中模块依赖的加载处理实例分析
Oct 10 Javascript
使用Vue完成一个简单的todolist的方法
Dec 01 Javascript
Vue.js实现表格渲染的方法
Sep 07 Javascript
vue点击标签切换选中及互相排斥操作
Jul 17 Javascript
js+audio实现音乐播放器
Sep 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
音乐朗读剧《MARS RED》2021年TV动画化决定!
2020/03/06 日漫
中东人咖啡哲学
2021/03/03 咖啡文化
PHP实现的注册,登录及查询用户资料功能API接口示例
2017/06/06 PHP
二行代码解决全部网页木马
2008/03/28 Javascript
两种WEB下的模态对话框 (asp.net或js的分别实现)
2009/12/02 Javascript
JS实现Enter键跳转及控件获得焦点
2013/08/12 Javascript
jquery根据锚点offset值实现动画切换
2014/09/11 Javascript
JS中产生标识符方式的演变
2015/06/12 Javascript
JS判断页面是否出现滚动条的方法
2015/07/17 Javascript
BOM系列第二篇之定时器requestAnimationFrame
2016/08/17 Javascript
深入理解jQuery3.0的domManip函数
2016/09/01 Javascript
angular4中关于表单的校验示例
2017/10/16 Javascript
vue + any-touch实现一个iscroll 实现拖拽和滑动动画效果
2019/04/08 Javascript
vue动态渲染svg、添加点击事件的实现
2020/03/13 Javascript
微信小程序连接服务器展示MQTT数据信息的实现
2020/07/14 Javascript
vue中路由跳转不计入history的操作
2020/09/21 Javascript
[02:17]2016国际邀请赛中国区预选赛VG战队领队采访
2016/06/26 DOTA
[42:32]完美世界DOTA2联赛循环赛 Magma vs PXG BO2第二场 10.28
2020/10/28 DOTA
python基础教程之匿名函数lambda
2017/01/17 Python
Python基于回溯法子集树模板解决旅行商问题(TSP)实例
2017/09/05 Python
wxpython实现图书管理系统
2018/03/12 Python
python 杀死自身进程的实现方法
2019/07/01 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
PyTorch中 tensor.detach() 和 tensor.data 的区别详解
2020/01/06 Python
Python实现i人事自动打卡的示例代码
2020/01/09 Python
浅谈Python 命令行参数argparse写入图片路径操作
2020/07/12 Python
在pycharm创建scrapy项目的实现步骤
2020/12/01 Python
Hashtable 添加内容的方式有哪几种,有什么区别?
2012/04/08 面试题
计算机专业自我鉴定
2013/10/15 职场文书
大学生创业计划书的格式要求
2013/12/29 职场文书
大学迎新标语
2014/06/26 职场文书
小学捐书活动总结
2014/07/05 职场文书
医院深入开展党的群众路线教育实践活动实施方案
2014/08/27 职场文书
应聘教师求职信范文
2015/03/20 职场文书
银行资信证明
2015/06/17 职场文书
python 下划线的多种应用场景总结
2021/05/12 Python