使用jquery选中父节点和子节点复选框时选中,选中复选框

时间:2013-12-14 09:32:38

标签: jquery checkbox

基本上我有2级设置:

Parent 
   Child
     Sub Child
       Sub Sub child
Parent1
    Child 1
      Sub Child 1
      etc..
  • 如果选中/取消选中父级,则其子级和 子女应该不被打扰,这意味着(未经检查)。
  • 如果选中/取消选中子项或子项,则其父项应为 检查
  • 如果未选中子项或子项,则应取消选中其父项。

我的整体重点是如果检查子或子,则应检查其父节点。如果我们试图检查孩子而不是父母意味着我们不能允许在检查其子节点时取消选中父节点。但我们可以检查取消选中父级,而不检查子级或子级。

我的代码:

jQuery('li :checkbox').change(function() {
            var $parent = $(this).parents().eq(2);
            $parent.children('li :checkbox').prop('checked', $parent.find('li :checkbox:checked').size() > 0).change();
        });

HTML:

<ul id="treeList">
   <li>
   <input type="checkbox" name="selectedRole">
   Application Manager
    <ul>
       <li>
           <input type="checkbox" name="selectedRole">
           Application Manager Panel
       </li>
       <li>
            <input type="checkbox" name="selectedRole">
            Client Role
             <ul>
               <li>
                   <input type="checkbox" name="selectedRole">
                   Client Task 1
                </li>
                <li>
                   <input type="checkbox" name="selectedRole">
                    Client Task 2
                </li>

                 </ul>
              </li>

          <li>
            <input type="checkbox" name="selectedRole">
            Client Role
             <ul>
               <li>
                   <input type="checkbox" name="selectedRole">
                   Client Task 1
                </li>
                <li>
                   <input type="checkbox" name="selectedRole">
                    Client Task 2
                </li>


           </ul>
       </li>

</ul>

0 个答案:

没有答案