❗ 本文最后更新于 5743 天前,文中所描述的信息可能已发生改变,请谨慎使用。
很多情况下,我们需要跨域读取数据,或者是调用别人json格式的api,都要用到js callback这种机制。通常做法是页面上定义一个A方法,再调用第三方的url并且把回调函数名A传过去。这样做固然没什么问题,但有没有更好的方法呢?
用过jQuery的同学肯定都知道,jQuery有一个getJSON的方法,只需要两个参数(callback地址和匿名函数)就能正常工作。摘录官方示例如下:
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",
function(data){
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});
很神奇吧!在这个例子中,我们并不用指定callback函数名,回调也仅仅只是一个匿名函数而已,那么它是怎么完成函数调用的呢?去看下jQuery的源代码,你会发现其实原理很简单。如果懒得看太多代码,看看下面我写的山寨版loadJSON,也能明白。
function loadJSON(url,callback){
var cn = "jscallback"+(+new Date());
var s = document.createElement("script");
s.type = "text/javascript";
s.src = url+cn;
window[cn] = callback;
document.getElementsByTagName("head")[0].appendChild(s);
};
loadJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=",function(o){
for(var i=0;i<3;i++){
var img = document.createElement("img");
img.src = o.items[i].media.m;
document.body.appendChild(img);
}
});
本文链接:https://mailseason.com/post/js-callback-name.html,参与评论 »
--EOF--
发表于 2009-04-03 14:41:02,并被添加「JavaScript」标签。查看本文 Markdown 版本 »
Comments
Waline 评论加载中...