可使用递归javascript函数扩展的表行
可使用递归javascript函数扩展的表行
提问于 2012-12-12 00:04:54
<tr onclick="removeAllDescendant(this)" parentid="@item.parentId" id="@item.id">
<td>
Use: <input type="checkbox" value="@item.iaId" />
Qty: <input type="text" class="width_100" />
</td>
<td>@item.location</td>
<td>@item.qty @item.uom</td>
<td>@item.createDt</td>
<td> </td>
<td> </td>
</tr>我动态地创建了这些表行，每一行都有parent-id和一个id。我想折叠所有后代行，当用户在行单击时。
这是javascript代码-
function removeAllDescendant(row)
{
var id = $(row).attr("id");
removeRows(row, id);
}
function removeRows(row, id) {
var tr = $(row).nextAll('tr [parentid=' + id + ']');
if (tr.length > 0) {
for (i = 0; i < tr.length; i++) {
id = $(tr[i]).attr("id");
alert(id);
removeRows(tr[i], id);
}
}
$(tr).remove();
}你们有没有看到这个递归函数中有任何bug，因为某些原因，如果我有超过3个级别，这个函数就不能工作了。
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-12-13 02:14:59
在调试javascript代码后，我找到了问题的原因。我应该为每个递归调用定义变量(I)。所以修正后的代码是..。
function removeRows(row, id) {
var tr = $(row).nextAll('tr [parentid=' + id + ']');
if (tr.length > 0) {
for (var i = 0; i < tr.length; i++) {
var tempId = $(tr[i]).attr("id");
removeRows(tr[index], tempId);
}
}
$(tr).remove();
}现在完美地工作了:)
Stack Overflow用户
发布于 2012-12-12 01:31:41
在我看来，您提供的代码并没有很好地说明您想要做什么(并且没有定义expandMainRow函数)。不管怎样，如果我理解正确的话，你想让点击后的所有行都消失，对吧？(我的意思是这样：http://jsfiddle.net/Polmonite/Hdaeg/ )如果是这样的话，你可以简单地这样做：
$('table tr:not(:last-child)').on('click',function(){
if($(this).hasClass('clicked')){
$(this).removeClass('clicked').nextAll('tr').show();
}else{
$(this).addClass('clicked').nextAll('tr').removeClass('clicked').hide();
}
});这样，当您单击一行时，以下行将消失，而如果您再次单击它，它们将重新出现。如果你不想让它们在点击时再次出现，你可以更简单地这样做：
$('table tr').on('click',function(){
$(this).nextAll('tr').hide();
}如果我误解了问题，我向您道歉。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13823799
复制相关文章
相似问题
腾讯云开发者
