0

我已经问过一个类似的问题，但我发现我需要使用 AJAX 和 JSONP，这开辟了一个全新的伤害世界。

我正在与之合作的一家公司为其隐私政策和使用条款提供 API。我需要创建两个不同的页面：

  • 隐私政策
  • 使用条款

所以基本上我需要搜索从他们那里获得的数据，在“标签”中找到正确的术语（分别为“ext_privacy”和“ext_member_terms”），然后将该数组中的 HTML 代码用于页面的其余部分。

问题是，我不知道如何将数据从 AJAX 传递给函数，即使在那时，我也不知道如何适当地深入到这些部分 - 我认为它会是external.data。 results.tags，但这似乎不起作用。

这是我的网站代码：

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <title>Privacy Policy</title>
</head>
<body>
    <div id="data">
    </div>
    <script>

        $.ajax({
            type: 'GET',
            url: 'http://guywhogeeks.com/test/test.json',
            jsonpCallback: 'jsonCallback',
            contentType: 'application/json',
            cache: 'true',
            dataType: 'jsonp',
            success: dataFeed
        });

        function dataFeed(external) {

            //Establishing htmlString - testing to see if function even fires
            var htmlString = "Hello, world!";

            //I know this is WAY off - I wanted to add the HTML to htmlString
            /*$(external.data.results.tags).find(privacy).each(function() {

                $({
                    text : external.data.results.html
                }).appendTo(htmlString)

            });*/

            $('#data').html(htmlString);
        }
    </script>
</body>
</html>

这是（稍作修改的）JSON - 也托管在这里：

{"code":200,"status":"Ok","data":
    {"offset":0,"limit":20,"total":2,"target":"html_page","results":[
        {
            "id":"6",
            "title":"Privacy Policy",
            "description":"Privacy Policy",
            "html":"<div class=\"right-rail\">\r\n<div class=\"module\">\r\n<h2 class=\"episode-guide-header\">Web Site Privacy Policy<\/h2>\r\n<div class=\"module-body corp-home-top\">\r\n<div class=\"corp-home-wrapper privacy\">\r\n<\/div>\r\n<!--corp-home-wrapper--><\/div>\r\n<!--module-body corp-home-top-->\r\n<div class=\"module-shadow\">&#160;<\/div>\r\n<\/div>\r\n<!--module--><\/div>\r\n<!--right-rail-->",
            "tags":[
                "ext_privacy"
            ]
        },
        {
            "id":"66",
            "title":"License and TOU",
            "description":"License Agreement and Terms of Use",
            "html":"<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>License Agreement and Terms of Use<\/title>\r\n    <\/head>\r\n    <body>\r\n       <div class=\"right-rail\">\r\n<div class=\"module\">\r\n<h2 class=\"episode-guide-header\"> License Agreement and Terms of Use<\/h2>\r\n<\/div><\/body>\r\n<\/html>",
            "tags":[
                "ext_member_terms"
            ]
        }
    ]}
}

我很感激你能给我的任何帮助。

4

1 回答 1

1

You JSONP payload is incorrect. Your server should return a call to the "callback" function... in your example, the server should return:

jsonCallback(
{"code":200,"status":"Ok","data":
    {"offset":0,"limit":20,"total":2,"target":"html_page","results":[
        {
            "id":"6",
            "title":"Privacy Policy",
            "description":"Privacy Policy",
            "html":"<div class=\"right-rail\">\r\n<div class=\"module\">\r\n<h2 class=\"episode-guide-header\">Web Site Privacy Policy<\/h2>\r\n<div class=\"module-body corp-home-top\">\r\n<div class=\"corp-home-wrapper privacy\">\r\n<\/div>\r\n<!--corp-home-wrapper--><\/div>\r\n<!--module-body corp-home-top-->\r\n<div class=\"module-shadow\">&#160;<\/div>\r\n<\/div>\r\n<!--module--><\/div>\r\n<!--right-rail-->",
            "tags":[
                "ext_privacy"
            ]
        },
        {
            "id":"66",
            "title":"License and TOU",
            "description":"License Agreement and Terms of Use",
            "html":"<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <title>License Agreement and Terms of Use<\/title>\r\n    <\/head>\r\n    <body>\r\n       <div class=\"right-rail\">\r\n<div class=\"module\">\r\n<h2 class=\"episode-guide-header\"> License Agreement and Terms of Use<\/h2>\r\n<\/div><\/body>\r\n<\/html>",
            "tags":[
                "ext_member_terms"
            ]
        }
    ]}
});

In your client, you should define "jsonCallback" like:

jsonCallback(data) {
// data is a regular javascript object at this point
// so you can access 'data.data.results[0].html' without a problem
}

Check this for more information: http://en.wikipedia.org/wiki/JSONP

Hope it helps.

于 2013-05-14T18:08:18.700 回答