限制在嵌套列表中添加列表元素的数量jQuery

Hy。我有一个列表，当我按下对应于特定li元素的“添加”按钮时，它将为该li添加一个子项。我想限制我可以添加到所有li元素的孩子数量。例如，我希望能够在list1的右侧添加最多2个子节点。我应该能够按“添加”按钮附近list1，然后“添加”按钮旁边childNode1并停止在那里。到list2限制在嵌套列表中添加列表元素的数量jQuery

类似我尝试这样的东西：

var listItems = $('ul').children().length;; 
alert(listItems);

但它会输出列表元素的每一次主要<ul>内部总数I，添加一个新的list element。 JSFiddle。

来源

2015-02-05 prsadrian

考虑给你的HTML一个完满成功的基础，也许更多的JS – 2015-02-05 16:06:08

您选择的方式是正确的。只要把它放在if语句中并设置长度的数字即可。

var childLimiter = 2; 
    var listItems = $('ol').children('li').length; 
    if(listItems <= childLimiter){ 
     $(this).parent().append('<ol><li>child node<input type="button" value="add" /></li></ol>');  
    } else { 
     $(this).parent().append('<ol><li>child node</li></ol>'); 
    }

看到更新fiddle

问候提摩太

来源

2015-02-05 16:12:42

我已经测试的代码了一下，有一个问题。而不是“childLimiter”，我需要一个“levelLimiter”，这样所有在'list1'和'list2'第一级的孩子都必须有一个“add”按钮。所有在'list1'和'list2'第二级的孩子都不应该有“添加”按钮。任何想法如何完成？ – prsadrian 2015-02-05 17:20:13

最简单的解决方案是，如果你给你的dom第一个ol课。比如 “OL - 启动”，比你只需要改变，如果来自：如果（listItems中的<= childLimiter）{ 到：如果（$（本）.parent（）父（ '醇'）hasClass。（'startingOl'））{working fiddle：http://jsfiddle.net/CfY5b/27/ – 2015-02-05 17:43:17

非常感谢您的解决方案。它现在有效。如果我想用更多的儿童级别按钮来扩展它，我只需要添加另一个“if子句”，它附加一个“ol class =”Level2“'。 – prsadrian 2015-02-05 18:19:22

限制在嵌套列表中添加列表元素的数量jQuery

回答

相关问题