我正确使用 jquery getJSON 吗？ godaddy的页面上什么都没有

Question

我有一个 json 文件和一个使用 jquery 1.10 getJSON 的索引文件，我正在尝试从 json 文件中获取数据以显示。我已经让它在我的本地主机上工作，但是当我将索引文件移动到子域 mbsk8.zerogravity-web.com 并将 JSON 文件移动到基​​本域 www.zerogravity-web .com，应该更新的页面部分是空白的。这让我相信这是一个跨域请求问题。

console.log 中也没有添加任何值。

这是我尝试处理的跨域请求：

• 在 URL 末尾添加了 "?callback=?"
• 在 JSON 对象周围添加了一个名称：jsonResponse(JSON 格式对象)

我的godaddy账户的文件夹结构是：

json 文件： /LloydIce/json/skschedule.json

索引文件： /LloydIce/m/index.html (m) 是移动的子域，使用jquery mobile

index.html 的代码

jquery 资源的标题部分

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>

标题中的脚本部分

$(document).on('pagebeforeshow','#OpenSkate',function() {
$('#publicHolder').empty();
    $.getJSON('http://www.zerogravity-web.com/LloydIce/json/skschedule.json?callback=?',function(data)
{
  $.each(data, function(index, data){

    var collapsible = $('<div data-role="collapsible"></div>');
    console.log(this.day);
    collapsible.append('<h2>' + this.day + '</h2>');


      $.each(data.activities, function(index, data){
        if(this.type === "Public"){
        console.log(this.notes + ", " + this.activity);
        collapsible.append('<p><strong>' + this.activity + '</strong></p>');


        $.each(data.times, function(index, data){
          collapsible.append('<p><strong>Start:</strong> ' + this.start + ', <strong>End:</strong> ' + this.end + '</p></div>');

                    });
                    }
                });
            var collapsibleSet = $("#publicHolder");
            collapsibleSet.append(collapsible);
            collapsibleSet.trigger('create');
            });

        }); 
    });

JSON 文件代码：

jsonResults(
[
    {
    "day": "Monday",
    "activities": [
        {
            "type": "Class",
            "notes": "Ages 3-5",
            "activity": "Snowbunnies 1 ",
            "times": [
                {"start":"6:00 PM","end":"6:45 PM"}
            ]
        },
        {
            "type": "Public",
            "notes": "N/A",
            "activity": "Open Skate ",
            "times": [
                {"start":"11:30 AM","end":"5:00 PM"},
                {"start":"7:30 PM","end":"9:30 PM"}
            ]
        }
    ]
}
]
);

chrome 开发工具网络 - 标题选项卡

   Request URL:http://www.zerogravity-web.com/LloydIce/json/skschedule.json?callback=jQuery110206146174017339945_1388711470249&_=1388711470252
Request Method:GET
Status Code:200 OK
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Cookie:__utma=183972909.883508564.1382898602.1388360907.1388663932.3; __utmz=183972909.1382898602.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none)
Host:www.zerogravity-web.com
Referer:http://mbsk8.zerogravity-web.com/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36
Query String Parametersview sourceview URL encoded
callback:jQuery110206146174017339945_1388711470249
_:1388711470252
Response Headersview source
Accept-Ranges:bytes
Access-Control-Allow-Origin:http://mbsk8.zerogravity-web.com
Access-Control-Allow-Origin:http://mbsk8.zerogravity-web.com
Connection:Keep-Alive
Content-Length:563
Content-Type:application/json
Date:Fri, 03 Jan 2014 01:48:53 GMT
ETag:"233-4ef071c1e30e4"
Keep-Alive:timeout=5, max=100
Last-Modified:Fri, 03 Jan 2014 01:48:42 GMT
Server:Apache

Chrome 开发工具网络 - 预览和响应标签：

jsonResults(
[
    {
        "day": "Monday",
        "activities": [
            {
                "type": "Class",
                "notes": "Ages 3-5",
                "activity": "Snowbunnies 1 ",
                "times": [
                    {"start":"6:00 PM","end":"6:45 PM"}
                ]
            },
            {
                "type": "Public",
                "notes": "N/A",
                "activity": "Open Skate ",
                "times": [
                    {"start":"11:30 AM","end":"5:00 PM"},
                    {"start":"7:30 PM","end":"9:30 PM"}
                ]
            }
        ]
    }
]
);

Chrome 开发工具控制台

Uncaught ReferenceError: jsonResults is not defined skschedule.json?callback=jQuery110206146174017339945_1388711470249&_=1388711470252:1
(anonymous function)

如果我从 JSON 文件中删除 jsonResults，网络预览选项卡中的信息如下所示

[{day:Monday,...}]
    0: {day:Monday,…}
activities: [{type:Class, notes:Ages 3-5, activity:Snowbunnies 1 , times:[{start:6:00 PM, end:6:45 PM}]},…]
0: {type:Class, notes:Ages 3-5, activity:Snowbunnies 1 , times:[{start:6:00 PM, end:6:45 PM}]}
activity: "Snowbunnies 1 "
notes: "Ages 3-5"
times: [{start:6:00 PM, end:6:45 PM}]
0: {start:6:00 PM, end:6:45 PM}
end: "6:45 PM"
start: "6:00 PM"
type: "Class"
1: {type:Public, notes:N/A, activity:Open Skate ,…}
activity: "Open Skate "
notes: "N/A"
times: [{start:11:30 AM, end:5:00 PM}, {start:7:30 PM, end:9:30 PM}]
0: {start:11:30 AM, end:5:00 PM}
end: "5:00 PM"
start: "11:30 AM"
1: {start:7:30 PM, end:9:30 PM}
end: "9:30 PM"
start: "7:30 PM"
type: "Public"
day: "Monday"

毕竟，我的页面上仍然没有显示结果。

Answer 1

因为你添加了 jsonResults 来包装你的 json 数据，这变成了一个 jsonp 请求，而不是一个 ajax 请求了。请谷歌“ajax 和 jsonp 的区别”。

jQuery.ajax({
    url : your url,
    dataType : 'jsonp',
    jsonpCallback : 'jsonResults',
    ......
});