Question

所以我使用dataType：json写了一个对github的ajax调用，它在我的本地机器上运行，但似乎我需要使用dataType：jsonP来处理跨域问题。所以任何人都可以帮我做出必要的改变。（BTW github似乎支持jsonp dataTypes - https://github.com/pgxn/pgxn-api/wiki/JSONP）

$.ajax({
    url: "https://api.github.com/repos/jeffreycwitt/prollecture1/tags",
    dataType: "jsonp",
    crossDomain: true,
    success: function(returndata) {
        if (returndata.length === 0) {
            $("#versionBox").remove();
        }
        else if (returndata.length === 1) {
            $("#versionBox").remove();
        }
        else {
            $.each(returndata, function() {
                $("#versionBox").show();
                var tag = this["name"];
                console.log(tag);
                var currentVersion = $("#editionNumber").text();
                if (tag.substring(1) === currentVersion) {
                    tag = tag + " (Current Version)";
                }
                var linkname = "textdisplay.php?flag=<?php echo $fs; ?>&ed=" + tag;
                $('#versionSubBox').append("<p><a href='" + linkname + "'>View Version: " + tag + "</a></p>");
            });

        }
    }
});

就像我说的那样，当我刚刚使用dataType，json时，这是有效的，但它不能与jsonP一起使用。我受到了印象，github将发回包含在添加到调用?callback=?的回调参数命名的内容中的常规json。（当dataType更改为jsonp时，此参数由jquery自动添加。那么我是否需要以某种方式修改我的成功函数以解析包装器？

Answer 1

您的代码似乎可以在此live demo中看到。

您遇到的问题是您正在尝试访问该网站上的.length媒体资源 returndata对象和此类属性不存在：

{
    "data": [
        {
            "tarball_url": "https://github.com/jeffreycwitt/prollecture1/tarball/v0.2",
            "commit": {
                "sha": "46a8aea57cd095a603f194f83cd4a18adcb35908",
                "url": "https://api.github.com/repos/jeffreycwitt/prollecture1/commits/46a8aea57cd095a603f194f83cd4a18adcb35908"
            },
            "name": "v0.2",
            "zipball_url": "https://github.com/jeffreycwitt/prollecture1/zipball/v0.2"
        }
    ],
    "meta": {
        "status": 200,
        "X-RateLimit-Limit": "5000",
        "X-RateLimit-Remaining": "4993"
    }
}

我猜你的意思是returndata.data.length，因为你有data属性是一个数组。

所以：

var data = returndata.data;
if (data.length === 0) {
    $("#versionBox").remove();
}
else if (data.length === 1) {
    $("#versionBox").remove();
}
else {
    $.each(data, function() {
        $("#versionBox").show();
        var tag = this["name"];
        console.log(tag);
        var currentVersion = $("#editionNumber").text();
        if (tag.substring(1) === currentVersion) {
            tag = tag + " (Current Version)";
        }
        var linkname = "textdisplay.php?flag=<?php echo $fs; ?>&ed=" + tag;
        $('#versionSubBox').append("<p><a href='" + linkname + "'>View Version: " + tag + "</a></p>");
    });
}

Answer 2

答案（具体到GitHub，我猜）在于找到一个通过额外数据层的方法，这个数据不包含在普通的json调用中。

所以这里代码如何变化。在三个具体点，我将returndata更改为returndata.data。

$.ajax({
url: "https://api.github.com/repos/jeffreycwitt/prollecture1/tags",
dataType: "jsonp",
crossDomain: true,
success: function(returndata) {
    if (returndata.data[0].length === 0) {
        $("#versionBox").remove();
    }
    else if (returndata.data[0].length === 1) {
        $("#versionBox").remove();
    }
    else {
        $.each(returndata.data, function() {
            $("#versionBox").show();
            var tag = this.name;
            console.log(tag);
            var currentVersion = $("#editionNumber").text();
            if (tag.substring(1) === currentVersion) {
                tag = tag + " (Current Version)";
            }
            var linkname = "textdisplay.php?flag=<?php echo $fs; ?>&ed=" + tag;
            $('#versionSubBox').append("<p><a href='" + linkname + "'>View Version: " + tag + "</a></p>");
        });

    }
 }
});

jquery jsonp并了解回调的工作原理

2 个答案: