首页 > 语言 > JavaScript > 正文

AJAX跨域请求json数据的实现方法

2024-05-06 14:33:58
字体:
来源:转载
供稿:网友
我们都知道,AJAX的一大限制是不允许跨域请求。 不过通过使用JSONP来实现。JSONP是一种通过脚本标记注入的方式,它是可以引用跨域URL的js脚本,不过需要提供一个回调函数(必须在您自己的页面上),因此,你可以自己处理结果。 让我们看看JSONP的是怎么在jQuery,MooTools的,Dojo Toolkit中实现的。

jQuery的JSONP
jQuery.getJSON方法:

Js代码
代码如下:
jQuery.getJSON("http://search.twitter.com/search.json?callback=?",{
    q: "Arsenal"
},function(tweets) {
    // Handle response here
    console.info("Twitter returned: ",tweets);
});

或者 类似

Js代码
代码如下:
$.ajax({
                type:"get",
                data:"random="+Math.random(),
                url:url,
                dataType:"jsonp",
                jsonp:"callback",
                success:function(data){
                      $.each(data, function(key, val) {
                        $("#myDiv").html($("#myDiv").html()+val.cvalue+"</br>");
                      });
                }
            });

回调方法的参数 通过getJSON 就可以获取 到json对象

MooTools JSONP
MooTools 需要Request.JSONP Class , 可以从这里下载MooTools More .  选择Request.JSONP,
这样 从另一个域获取json就是小菜一碟了.

Js代码
代码如下:
new Request.JSONP({
    url: "http://search.twitter.com/search.json",
    data: {
        q: "Arsenal"
    },//提交的参数, 没有参数可以不写
        callbackKey: 'jsoncallback',//自己定义回调函数的参数名称
        onComplete: function(tweets) {
        // Log the result to console for inspection
        console.info("Twitter returned: ",tweets);
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选