使用JQuery限制动态添加的表行数
提问于 2010-02-02 21:09:00
我使用JQuery使用clone动态地将一行插入到表中。
$('#Clone').click(function() {
//put jquery this context into a var
var $btn = $(this).parent();
//use .closest() to navigate from the buttno to the closest row and clone it
//use clone(true) to pass events to cloned item
var $clonedRow = $btn.closest('tr').clone(true).insertAfter($btn);
});最终用户将控制新行的插入。我需要将新的行数限制为5行。有没有办法使用cookie或其他方法(数组)来做到这一点。我可以有多个表有自己的唯一id，所以它需要与页面上的多个表一起工作。
希望你能帮上忙。
回答 5
Stack Overflow用户
回答已采纳
发布于 2010-02-02 21:24:39
您总是可以简单地为每个表使用一个变量来跟踪添加的行数。
或者，另一种选择是使用jQuery的data()方法，它允许您直接将数据存储在dom元素中。单击事件将查找其表，并在每次添加行时更新表的数据()，并在行达到最大值时阻止进一步添加。
编辑：更正了代码，并检查theCount是否未定义，并删除了错误放置的圆括号。
$('#Clone').click(function() {
var $btn = $(this).parent();
if($btn.closest('table').data('theCount') == undefined) {
$btn.closest('table').data('theCount', 0)
}
var currentCount = $btn.closest('table').data('theCount');
if(currentCount < 5) {
$btn.closest('tr').clone(true).insertAfter($btn);
$btn.closest('table').data('theCount', currentCount + 1);
}
});Stack Overflow用户
发布于 2010-02-02 21:20:40
变量怎么样？
function addClick(identifier, max){
var i = 0;
$(identifier).click(function() {
if (i < max){
//add row
i++;
}
}
}
addClick("#Clone", 5);或者，您也可以在用户添加的类上设置不同的类，然后在add函数中对它们进行计数。
Stack Overflow用户
发布于 2010-02-02 21:15:54
您可以只计算返回的元素的数量。
function countRows() {
return $("#table-id tr").length + $("#table2-id tr").length; // etc, for all table ID's.
}或者，您可以向用户添加的行添加一个特殊的类。
function countRows() {
return $("tr.new").length;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/2187728
复制相关文章
腾讯云开发者
