jquery结合JSONP教程—明河谈jquery

http://www.36ria.com/1714

1、什么是jsonp?

Ajax技术现在非常的盛行,但javascript的跨域问题一直是个问题,而jsonp的出现算是比较好的解决方案。

关于jsonp最详细的介绍请看:http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/

jsonp的基础知识上面这个页面已经非常详细了,不再重复。接下来重要演示jquery下jsonp的使用。

2、jquery与jsonp

jquery已经可以完美的使用jsonp,而且一如既往的便利。

$.getJSON()

这是最关键的函数,返回json数据,与其他的ajax门面函数类似,比如$.get(),$.getScript()等,但有个非常不一样的地方。来看下面代码

jQuery.getJSON(“http://api.zuosa.com/statuses/public_timeline.json?callback=?”, function(data) {
alert(data);
});

这里我使用微博做啥网的一个API,public_timeline.json返回json数据。
这里留意的是callback=?,非常关键的点,jQuery 自动将 ? 替换为要调用的生成函数名,所以callback相当于一个接口,是解决跨域的关键。后面的?是必须的。
运行后如图:

那么实际返回的json数据是什么情况呢?请看下面的截图:

数据太多了,可以运行下demo然后用firebug查看。
现在的firebug可以查看格式化的json数据,效果如下:

点击进去后可以查看的到详细的单条json数据,如下:

实际过程就是这么简单,可以在回调函数中对数据进行操作。

原文地址:https://www.cnblogs.com/pesserger/p/3956355.html