使用JQuery进行跨域请求

 更新时间:2010年01月25日 23:00:12   作者:  
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;
}
});

相关文章

  • Three.Js实现看房自由小项目

    Three.Js实现看房自由小项目

    目前随着元宇宙概念的爆火,THREE技术已经深入到了物联网、VR、游戏、数据可视化等多个平台,今天我们主要基于THREE实现一个三维的VR看房小项目,感兴趣的朋友跟随小编一起看看吧
    2022-10-10
  • 详解html-webpack-plugin插件(用法总结)

    详解html-webpack-plugin插件(用法总结)

    这篇文章主要介绍了详解html-webpack-plugin插件(用法总结),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • js 两数组去除重复数值的实例

    js 两数组去除重复数值的实例

    下面小编就为大家分享一篇js 两数组去除重复数值的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • js 用于检测类数组对象的函数方法

    js 用于检测类数组对象的函数方法

    下面小编就为大家带来一篇js 用于检测类数组对象的函数方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • Object.defineProperty() 完整指南示例详解

    Object.defineProperty() 完整指南示例详解

    本文深入理解`Object.defineProperty()`的方法,包括基础概念、属性描述符的完整选项、常见使用场景等,感兴趣的朋友跟随小编一起看看吧
    2025-01-01
  • echarts折线图每段显示不同的颜色的实现

    echarts折线图每段显示不同的颜色的实现

    本文主要介绍了echarts折线图每段显示不同的颜色的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-09-09
  • 在线编辑器的实现原理(兼容IE和FireFox)

    在线编辑器的实现原理(兼容IE和FireFox)

    在线编辑器的实现原理(兼容IE和FireFox)...
    2007-03-03
  • JS简单设置下拉选择框默认值的方法

    JS简单设置下拉选择框默认值的方法

    这篇文章主要介绍了JS简单设置下拉选择框默认值的方法,涉及javascript针对页面元素的遍历、查找及设置技巧,需要的朋友可以参考下
    2016-08-08
  • js模拟C#中List的简单实例

    js模拟C#中List的简单实例

    本篇文章主要是对js模拟C#中List的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-03-03
  • 利用JS实现一个同Excel表现的智能填充算法

    利用JS实现一个同Excel表现的智能填充算法

    这篇文章主要给大家介绍了关于利用JS实现一个同Excel表现的智能填充算法的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-08-08

最新评论