我有下面的 jQuery 接收来自 AJAX 请求的响应来构建一个表，但是每个似乎在其下面的追加之后被触发，我如何确保在每个完成之前该表不会关闭。
$.ajax({
type: "POST",
url: "api/getFirmTabletsDetails.php",
data: "id=" + firmID,
cache: false,
dataType: "json",
success: function(result)
{
var tabletArea = modal.find('#tablet-body');
tabletArea.html("");
tabletArea.append
(
'<div class="col-lg-12">
<table class="table table-hover table-striped"><thead>
<tr><th>Name</th><th>Status</th><th>Address</th></tr>
</thead><tbody>'
);
if (result.success = 1)
{
$.each(result.request, function( index, value )
{
var address = value.Street + "<br>" + value.Street2 + "<br>"
+ value.Town + "<br>" + value.County + "<br>"
+ value.Postcode;
tabletArea.append('<tr><td>'+value.Name+
'</td><td>'+value.Status+'</td><td>'+address+'</td></tr>');
});
}else{
alert(result.error);
}
tabletArea.append('</tbody></table></div></div>');
}
});
输出:
<html>
<head>
<title></title>
</head>
<body>
<div class="modal-body" id="tablet-body">
<div class="col-lg-12">
<table class="table table-hover table-striped">
<thead>
<tr>
<th>Name</th>
<th>Status</th>
<th>Address</th>
</tr>
</thead>
</table>
</div>
<table>
<tr>
<td>...</td>
<td>...</td>
<td>...
<br />...
<br />...
<br />...
<br />...</td>
</tr>
<tr>
<td>...</td>
<td>...</td>
<td>...
<br />...
<br />...
<br />...
<br />...</td>
</tr>
</table>
</div>
</body>
</html>
最佳答案
You are using
appendmethod incorrectly.
正如您在官方文档中所读到的，append( content ) 接受一个参数，该参数可以是 DOM 元素、文本节点、元素和文本节点数组、HTML 字符串或 jQuery要插入到匹配元素集中每个元素末尾的对象。 您在这里所做的是重复传递字符串片段。您应该传递要附加的元素的完整 htmlString。如果您想采用类似于您已经在做的方法，您可以保留一个字符串并不断向其中添加元素。完成后，您可以将字符串一次传递到 append(content) 方法。检查下面给出的代码:
$.ajax({
type: "POST",
url: "api/getFirmTabletsDetails.php",
data: "id=" + firmID,
cache: false,
dataType: "json",
success: function(result){
var tabletArea = modal.find('#tablet-body');
tabletArea.html("");
var htmlString = "";
htmlString += '<div class="col-lg-12"><table class="table table-hover table-striped"><thead><tr><th>Name</th><th>Status</th><th>Address</th></tr></thead><tbody>';
if (result.success = 1){
$.each(result.request, function( index, value ) {
var address = value.Street + "<br>" + value.Street2 + "<br>" + value.Town + "<br>" + value.County + "<br>" + value.Postcode;
htmlString += '<tr><td>'+value.Name+'</td><td>'+value.Status+'</td><td>'+address+'</td></tr>';
});
}else{
alert(result.error);
}
htmlString += '</tbody></table></div></div>';
tabletArea.append( htmlString );
}
});
关于javascript - Jquery表html输出不正确，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38565465/