使用JQuery進(jìn)行跨域請(qǐng)求
$(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;
}
});
- jQuery使用ajax跨域請(qǐng)求獲取數(shù)據(jù)
- jquery+ajax實(shí)現(xiàn)跨域請(qǐng)求的方法
- jquery的ajax跨域請(qǐng)求原理和示例
- jquery跨域請(qǐng)求示例分享(jquery發(fā)送ajax請(qǐng)求)
- 利用JQuery和Servlet實(shí)現(xiàn)跨域提交請(qǐng)求示例分享
- JQuery的Ajax跨域請(qǐng)求原理概述及實(shí)例
- jquery $.getJSON()跨域請(qǐng)求
- 跨域請(qǐng)求之jQuery的ajax jsonp的使用解惑
- 通過jquery的$.getJSON做一個(gè)跨域ajax請(qǐng)求試驗(yàn)
- 深入理解jquery跨域請(qǐng)求方法
相關(guān)文章
無語,javascript居然支持中文(unicode)編程!
無語,javascript居然支持中文(unicode)編程!...2007-04-04javascript正則表達(dá)配置擴(kuò)展名并實(shí)現(xiàn)驗(yàn)證
這篇文章主要介紹了javascript正則表達(dá)配置擴(kuò)展名并實(shí)現(xiàn)驗(yàn)證,文章圍繞主題展開相關(guān)資料,具有以得參考價(jià)值,需要的小伙伴可以參考一下2022-02-02JavaScript中的一些實(shí)用小技巧總結(jié)
這篇文章主要給大家總結(jié)介紹了關(guān)于JavaScript中的一些實(shí)用小技巧,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04Json字符串轉(zhuǎn)換為JS對(duì)象的高效方法實(shí)例
一般JSON字符串轉(zhuǎn)換為JS對(duì)象,都使用var jsonStr="{a:1}";var jsonObj = eval("("+jsonStr+")");2013-05-05基于bootstrap實(shí)現(xiàn)廣告輪播帶圖片和文字效果
這篇文章主要介紹了基于bootstrap實(shí)現(xiàn)廣告輪播帶圖片和文字效果,效果非常棒,需要的朋友可以參考下2016-07-07JS簡(jiǎn)單生成隨機(jī)數(shù)(隨機(jī)密碼)的方法
這篇文章主要介紹了JS簡(jiǎn)單生成隨機(jī)數(shù)(隨機(jī)密碼)的方法,簡(jiǎn)單分析了javascript隨機(jī)數(shù)相關(guān)函數(shù)并結(jié)合具體實(shí)例形式分析了隨機(jī)數(shù)的相關(guān)生成技巧,需要的朋友可以參考下2017-05-05詳解ES6 Fetch API HTTP請(qǐng)求實(shí)用指南
本次將介紹如何使用Fetch API(ES6 +)對(duì)REST API的 HTTP請(qǐng)求,還有一些示例提供給大家便于大家理解。具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-11-11uniapp的webview實(shí)現(xiàn)左滑返回上一個(gè)頁面操作方法
uniapp默認(rèn)左滑是關(guān)閉整個(gè)webview,而不是關(guān)閉當(dāng)前頁,本文給大家介紹uniapp的webview實(shí)現(xiàn)左滑返回上一個(gè)頁面操作方法,感興趣的朋友一起看看吧2023-12-12JS實(shí)現(xiàn)仿新浪黃色經(jīng)典滑動(dòng)門效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)仿新浪黃色經(jīng)典滑動(dòng)門效果代碼,是一款非常簡(jiǎn)單的經(jīng)典鼠標(biāo)響應(yīng)滑動(dòng)切換效果,涉及JavaScript基于鼠標(biāo)事件動(dòng)態(tài)操作頁面元素的技巧,需要的朋友可以參考下2015-09-09