将 JSON 与 Jquery Ajax 结合使用
今天早上我开始练习 Jquery AJAX JSON。我了解 Jquery,但了解 JSON & Ajax 对我来说是个新鲜事物。
我开发了一小段代码来使用 ajax 读取 JSON 文件并通过附加列表来显示数据值。
在正文部分使用以下 div。
<div id="tabPanelWrapper"></div>
Javascript:
$(document).ready(function() {
// Calling Ajax Function
loadContent();
});
function loadContent() {
$.ajax({
type: "GET",
url: "data.js",
dataType: "json",
cache: false,
contentType: "application/json",
success: function(data) {
alert("Success");
$.each(data.dashboard, function(i,post){
$('#tabPanelWrapper').append('<ul><li>' + data.id + '</li><li>' + data.name +'</li></ul>');
});
},
error: function(xhr, status, error) {
alert(xhr.status);
}
});
}
JSON 文件:
{
dashboard: [
{
"id": "tcm:20-1869",
"name": "FEATURED ARTICLE"
},
{
"id": "tcm:20-1869",
"name": "FEATURED ARTICLE"
}
]
}
页面抛出 404 错误。请帮我处理这段代码。
预先感谢|洛克什·亚达夫
I started my hands on training on Jquery AJAX JSON this morning. I have knowledge of Jquery but JSON & Ajax is something new to me.
I have developed a small snippet of code to read JSON file with ajax and show the data values by appending the list.
using following div in body section.
<div id="tabPanelWrapper"></div>
Javascript:
$(document).ready(function() {
// Calling Ajax Function
loadContent();
});
function loadContent() {
$.ajax({
type: "GET",
url: "data.js",
dataType: "json",
cache: false,
contentType: "application/json",
success: function(data) {
alert("Success");
$.each(data.dashboard, function(i,post){
$('#tabPanelWrapper').append('<ul><li>' + data.id + '</li><li>' + data.name +'</li></ul>');
});
},
error: function(xhr, status, error) {
alert(xhr.status);
}
});
}
JSON File:
{
dashboard: [
{
"id": "tcm:20-1869",
"name": "FEATURED ARTICLE"
},
{
"id": "tcm:20-1869",
"name": "FEATURED ARTICLE"
}
]
}
Page is throwing 404 error. Please help me with this code.
Thanks in advance | Lokesh Yadav
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
404 错误是页面未找到错误。我会尝试浏览到您尝试访问的 data.js 文件,并且可能尝试在 .ajax 调用中写出该文件的完整 url。
即
如果那是您的脚本的位置。
更新
您的错误是无效的 Json。如果您检查错误函数中的错误参数,您就会看到这一点。
尝试在仪表板周围添加引号,您应该更进一步!
而且您还必须更改您的成功方法:
请注意,我正在查看
post.id
和post.name
因为这是$.each 枚举。 data.id 会在 Json 中的仪表板旁边查找 id 属性,但该属性不存在。a 404 error is a Page Not found error. I'd try to browse to the data.js file you're trying to access, and maybe try to write out the full url to the file in your .ajax-call.
I.e.
if that's the location of your script.
UPDATE
Your error is invalid Json. If you check the error argument in your Error-function, you'd see that.
Try adding quotes around dashboard, and you should be one step further!
And you'll also have to change in your success-method:
note that I'm looking at
post.id
andpost.name
since that is the current item in the $.each enumeration. data.id would look for an id-property next to dashboard in your Json, but that doesn't exist.更改
为
404 错误肯定不是由此引起的。
change
to
defnitely the 404 error is not due to this.
检查 URL 属性。
404 错误不是 json 错误。
Check the URL property.
An 404 error is not a json error.