1

こんにちはすべて私はこのように見える複雑なチェックボックス構造を持っています

<div class="accordian-group">
    <div>
    <input type="checkbox" class="parentcheckbox" value""/>
        <ul>
         <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/>
            <ul>
               <li> <input type="checkbox" value""/></li>
               <li> <input type="checkbox" value""/></li>
              <li> <input type="checkbox" value""/>
                    <ul>
                      <li> <input type="checkbox" value""/></li>
                    </u>
                </li>
           </ul>
       </li>
    </div>
     <div>
    <input type="checkbox" class="parentcheckbox" value""/>
        <ul>
         <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/></li>
        <li> <input type="checkbox" value""/>
            <ul>
               <li> <input type="checkbox" value""/></li>
               <li> <input type="checkbox" value""/></li>
              <li> <input type="checkbox" value""/>
                    <ul>
                      <li> <input type="checkbox" value""/></li>
                    </u>
                </li>
           </ul>
       </li>
    </div>
</div>

私がやりたいのは、親のチェックボックスがチェックされているときに、divがチェックされている側のすべてのチェックボックスがオンになっている場合、親のチェックボックスの子ボックス内のすべてがチェックされている場合は、親のチェックボックスがチェックされている必要があります

親カテゴリがチェックされ、そのdivのすべての子がチェックされている場合、追加ボタンをクリックすると、ページに追加ボタンがあります。すべての値を取得する必要があります。これを行うにはどうすればよいですか。これを案内してください

4

2 に答える 2

0

これを試してください:ライブデモ

// Whenever the parent checkbox is checked/unchecked
$(".parentcheckbox").change(function() {
    // save state of parent
    c = $(this).is(':checked');
    $(this).parent().find("input[type=checkbox]").each(function() {
        // set state of siblings
        $(this).attr('checked', c);
    });
});

// Update parent checkbox based on children
$("input[type=checkbox]:not('.parentcheckbox')").change(function() {
    if ($(this).closest("div").find("input[type=checkbox]:not('.parentcheckbox')").not(':checked').length < 1) {
        $(this).closest("div").find(".parentcheckbox").attr('checked', true);
    } else {
        $(this).closest("div").find(".parentcheckbox").attr('checked', false);
    }
});
于 2013-03-09T19:28:35.867 に答える
0

あなたはこれを行うことができます ：

 $('input[type="checkbox"]').change(function(){
  if (!$(this).is(':checked')) return; // do nothing if not checking
  var li = $(this).closest('li');

  // check all children 
  $('li input[type="checkbox"]', li).prop('checked', true);

  // see if all siblings are checked
  var all = true;
  li.siblings().find('>input[type="checkbox"]').each(function(){
    if (!$(this).is(':checked')) all = false;
  });
  if (all) {
    // check parent checkbox
    $(this).closest('ul').closest(':has(>input)')
          .find('input[type="checkbox"]').prop('checked', true);
  }
});

デモンストレーション

于 2013-03-09T19:33:04.343 に答える