使用Jquery檢查/取消選中父/子複選框

我對jquery或javascript並不熟悉，我需要快速解決我的問題，這就是爲什麼im在此處發佈它。以下是一個示例html片段：使用Jquery檢查/取消選中父/子複選框

<ul> 
<li><input type="checkbox" />Administration 
    <ul> 
     <li><input type="checkbox" />President 
      <ul> 
       <li><input type="checkbox" />Manager 1 
        <ul> 
         <li><input type="checkbox" />Assistant Manager 1</li> 
         <li><input type="checkbox" />Assistant Manager 2</li> 
         <li><input type="checkbox" />Assistant Manager 3</li> 
        </ul> 
       </li> 
       <li><input type="checkbox" />Manager 2</li> 
       <li><input type="checkbox" />Manager 3</li> 
      </ul> 
     </li> 
     <li><input type="checkbox" />Vice President 
      <ul> 
       <li><input type="checkbox" />Manager 4</li> 
       <li><input type="checkbox" />Manager 5</li> 
       <li><input type="checkbox" />Manager 6</li> 
      </ul> 
     </li> 
    </ul> 
</li> 
</ul>

我想要做的是檢查管理員檢查時的所有內容。如果我不選總統，那麼他的父母也應該和他的孩子一起不加檢查，只讓副總統和他的孩子檢查。同樣，如果我檢查經理1，那麼他的孩子也應該檢查。但是，如果我取消選中助理管理員1，那麼Manager 1也應該取消選中，只留下助手。經理2和3被檢查。

請注意，此列表是動態的。意思是一個孩子可以有更多的孩子，等等。

在此先感謝！

來源

2014-03-19 user3360031

等都不是gimmie的DA codez網站。你需要嘗試一些東西並首先投入一點努力。 – j08691

@ j08691我想有人會這麼說。目前正在開展工作。這只是我的代碼無法使用。只希望有人已經回答過此問題，並希望分享。 :) – user3360031

您可能還想要說明覆選框的不確定狀態。 – j08691

看到這個：DEMO

$('li :checkbox').on('click', function() { 
    var $chk = $(this), 
     $li = $chk.closest('li'), 
     $ul, $parent; 
    if ($li.has('ul')) { 
     $li.find(':checkbox').not(this).prop('checked', this.checked) 
    } 
    do { 
     $ul = $li.parent(); 
     $parent = $ul.siblings(':checkbox'); 
     if ($chk.is(':checked')) { 
      $parent.prop('checked', $ul.has(':checkbox:not(:checked)').length == 0) 
     } else { 
      $parent.prop('checked', false) 
     } 
     $chk = $parent; 
     $li = $chk.closest('li'); 
    } while ($ul.is(':not(.someclass)')); 
});

禮貌：Uncheck parent checkbox if one child is unchecked

來源

2014-03-19 14:32:58 Anujith

完美！非常感謝！ :) – user3360031

謝謝A.V像夢一樣工作 –

完美！非常感謝！ :) –

使用Jquery檢查/取消選中父/子複選框

回答

相關問題