第二个条件陈述没有触发 -

时间:2016-08-31 07:30:35

标签: jquery if-statement checkbox

默认情况下,会选中所有复选框,并且具有父子关系。当取消选中所有复选框时,我想添加一个类。但是 第二个if语句不起作用 -

$(document).ready(function() {
    $('#treeList :checkbox').change(function() {
        $(this).siblings('ul').find(':checkbox').prop('checked', this.checked);
        if (this.checked) {
            $(this).parentsUntil('#treeList', 'ul').siblings(':checkbox').prop('checked', true);
        }
        else {
            $(this).parentsUntil('#treeList', 'ul').each(function() {
                var $this = $(this);
                var childSelected = $this.find(':checkbox:checked').length;
                if (!childSelected) {
                    $this.prev(':checkbox').prop('checked', false);
                }
            });
        }
    });

    // the second else if statement is not working
    if ($('#treelist :checkbox:not(:checked)').length == 0) {
        $('.row.cd-feed-wrapper').addClass('visible');
    }
    else if ($('#treelist :checkbox:checked').length == 0) {
        $('.row.cd-feed-wrapper').addClass('hidden');
    }

});

页面加载时的第一个。

codepen setup:http://codepen.io/Assert/pen/BLBjpk?editors=1010

<ul id="treeList">
  <li>
    <input type="checkbox" name="selectedRole" checked> mCRC
  <ul>
  <li>
    <input type="checkbox" name="selectedRole" checked> STIVARGA Efficacy
    <ul>
      <li>
        <input type="checkbox" name="selectedRole" checked> Long-Term Responders
      </li>
      <li>
        <input type="checkbox" name="selectedRole" checked> STIVARGA in Clinical Practice
      </li>
    </ul>
  </li>
  <li>
    <input type="checkbox" name="selectedRole" checked> STIVARGA AE Management
  </li>

  <li>
    <input type="checkbox" name="selectedRole" checked> Dosing
  </li>
  <li>
    <input type="checkbox" name="selectedRole" checked> Patient Communication
  </li>
  <li>
    <input type="checkbox" name="selectedRole" checked> Case Studies
  </li>
</ul>

<li>
  <input type="checkbox" name="selectedRole" checked> GIST
</li>

2 个答案:

答案 0 :(得分:1)

Rory's comment是一个答案:

  

您只在页面加载时运行if语句。大概你需要将它添加到你的change()事件处理程序中。

所以把代码放在一个函数中。在ready中调用该函数,在change处理程序中调用它。

答案 1 :(得分:0)

你的身份证是错的。

您在jquery代码中使用#treelist而不是#treeList。

Javascript不会那样工作

所以在所有情况下它只得到0并进入第一个IF状态。