可能重复Nested elements
我从服务器端 ajax 响应 (Json) 获取,我正在尝试动态创建表格行并将它们附加到 id=records_table
的现有表格。
我试图重复实现该解决方案,但失败了。
我的回复是这样的:
'[{
"rank":"9",
"content":"Alon",
"UID":"5"
},
{
"rank":"6",
"content":"Tala",
"UID":"6"
}]'
要求的结果是这样的:
<tr>
<td>9</td>
<td>Alon</td>
<td>5</td>
</tr>
<tr>
<td>6</td>
<td>Tala</td>
<td>5</td>
</tr>
我想在不解析 Json 的情况下做一些事情,所以我尝试执行以下操作,这当然是一场灾难:
function responseHandler(response)
{
$(function() {
$.each(response, function(i, item) {
$('<tr>').html(
$('td').text(item.rank),
$('td').text(item.content),
$('td').text(item.UID)
).appendTo('#records_table');
});
});
}
在我的解决方案中,我在所有单元格中只得到一行数字 6。我做错了什么?
最佳答案
使用 .append 代替 .html
var response = "[{
"rank":"9",
"content":"Alon",
"UID":"5"
},
{
"rank":"6",
"content":"Tala",
"UID":"6"
}]";
// convert string to JSON
response = $.parseJSON(response);
$(function() {
$.each(response, function(i, item) {
var $tr = $('<tr>').append(
$('<td>').text(item.rank),
$('<td>').text(item.content),
$('<td>').text(item.UID)
); //.appendTo('#records_table');
console.log($tr.wrap('<p>').html());
});
});
关于jquery - 使用 jQuery 从 AJAX 响应(json)构建表格行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54729713/