[英]Why my json data wont appear in browser when i run the code
My json data won't appear in browser. 我的json数据不会出现在浏览器中。 It's my first time using json and I can't figure out the problem.I searched on internet and it was related with mime but still can't figure it out.
这是我第一次使用json,我无法找出问题所在。我在互联网上进行搜索,发现它与mime有关,但仍然无法解决。 This is the code:
这是代码:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
var jsonData = '[{"rank":"9","content":"Alon","UID":"5"},{"rank":"6","content":"Tala","UID":"6"}]';
$.ajax({
url: '/echo/json/',
type: 'POST',
contentType:"application/json; charset=utf-8",
data: {
json: jsonData
},
success: function (response) {
var trHTML = '';
$.each(response, function (i, item) {
trHTML += '<tr><td>' + item.rank + '</td><td>' + item.content + '</td><td>' + item.UID + '</td></tr>';
});
$('#records_table').append(trHTML);
}
});
</script>
</head>
<body>
<table id="records_table" border='1'>
<tr>
<th>Rank</th>
<th>Content</th>
<th>UID</th>
</tr>
</table>
</body>
</html>
Here is the updated code 这是更新的代码
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
var jsonData = '[{"rank":"9","content":"Alon","UID":"5"},{"rank":"6","content":"Tala","UID":"6"}]';
$(document).ready(function(){
$.ajax({
url: '/echo/json/',
type: 'POST',
contentType:"application/json; charset=utf-8",
data: {
json: jsonData
},
success: function (response) {
var trHTML = '';
$.each(response, function (i, item) {
trHTML += '<tr><td>' + item.rank + '</td><td>' + item.content + '</td><td>' + item.UID + '</td></tr>';
});
$('#records_table').append(trHTML);
}
});
});
</script>
</head>
<body>
<table id="records_table" border='1'>
<tr>
<th>Rank</th>
<th>Content</th>
<th>UID</th>
</tr>
</table>
</body>
</html>
You were missing the document ready block around your ajax call. 您在ajax调用周围缺少文档就绪块。
Write a Error method and see if some ajax error has occured 编写一个Error方法,看看是否发生了一些ajax错误
`$.ajax({
success: function(){
// Handle the success event
},
error: function(xhr){
// Handle the error event
}
// ......
});`
The xhr will have response text xhr将显示响应文本
UPDATE: 更新:
your code is perfectly fine as nikhil said dodument.ready should do the magic 您的代码完全正确,就像nikhil所说的dodument.ready应该是魔术
check the fiddle i have tested with your code http://jsfiddle.net/8sfm0p14/ 检查我用您的代码测试过的小提琴http://jsfiddle.net/8sfm0p14/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.