Jquery .append()在<ul>标记中复制元素
Jquery .append()在<ul>标记中复制元素
提问于 2015-09-05 15:10:48
我正在创建一个论坛，我希望评论与他们的日期一起出现，这是html：
<div id="forum" class="panel panel-default">
<ul class="list-group">
</ul>
</div>我在元素后面加上jquery：
$.ajax({
url: '../public/comment',
type: 'GET',
dataType: 'json',
success:function(response) {
$('#forum ul').empty();
for (var i in response['comments'])
{
$('#forum ul').append('<li class="list-group-item"> <ul> <li class="list-group-item">' +
response['comments'][i].date + '</li> <li class="list-group-item">' +
response['comments'][i].comment + '</li> </ul> </li> ');
}
}
});但是，对于我附加到论坛的每一条评论，其余的评论都会被复制并附在论坛上。如果我有三个注释，它显示7，如果我有4，它显示15。
我意识到从jquery中删除ul标记可以解决这个问题，但出于美学原因，我需要这些标记。有什么不对的？
回答 2
Stack Overflow用户
回答已采纳
发布于 2015-09-05 15:19:20
通过写作
$('#forum ul').append(...)你把所有的东西都附加到你的论坛中的每个元素上，包括标签中的标签。
把它改成
$('#forum>ul').append(...)若要仅选择直接子女，请执行以下操作。
Stack Overflow用户
发布于 2015-09-05 15:15:38
我假设每个ajax调用都会得到所有的注释。在这种情况下，每次只需替换列表的整个html即可。
//clear your ul
$('#forum ul').html('');
//repopulate
$.ajax({
url: '../public/comment',
type: 'GET',
dataType: 'json',
success: function(response) {
$('#forum ul').empty();
for (var i in response['comments']) {
$('#forum ul').append('<li class="list-group-item"> <ul> <li class="list-group-item">' +
response['comments'][i].date + '</li> <li class="list-group-item">' +
response['comments'][i].comment + '</li> </ul> </li> ');
}
}
});
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32414588
复制相关文章
相似问题
腾讯云开发者
