我已经问了一个类似的问题,但我发现我需要使用AJAX和JSONP,这开辟了一个全新的伤害世界。
我与之合作的公司拥有其隐私政策和使用条款的API。我需要创建两个不同的页面:
所以基本上我需要搜索从他们那里得到的数据,在“tags”中找到正确的术语(分别是“ext_privacy”和“ext_member_terms”),然后使用该数组中的HTML代码这页纸。
问题是,我无法弄清楚如何将这些数据从AJAX传递给函数,即使在那时,我也不知道如何适当地深入研究这些部分 - 我认为它会是< em> 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 - 也托管了here:
{"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\"> <\/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"
]
}
]}
}
我很感激你能给我的任何帮助。
答案 0 :(得分:1)
您的JSONP有效负载不正确。您的服务器应该返回对“回调”函数的调用...在您的示例中,服务器应该返回:
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\"> <\/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"
]
}
]}
});
在您的客户端中,您应该定义“jsonCallback”,如:
jsonCallback(data) {
// data is a regular javascript object at this point
// so you can access 'data.data.results[0].html' without a problem
}
检查以获取更多信息:http://en.wikipedia.org/wiki/JSONP
希望它有所帮助。