首页 > 解决方案 > 如何仅从组复选框中的另一个复选框中检查所有其他复选框

问题描述

我只需要从其中一个复选框中启用检查(不取消选中)所有其他复选框

<input type="checkbox" name="product" value="all" />All Genders <br />
<input type="checkbox" name="product" value="women" />Women <br />
<input type="checkbox" name="product" value="men" />Men<br />
<input type="checkbox" name="product" value="bi" />Bi<br />

我需要做的是women, men and bi在用户单击所有复选框时检查所有复选框,但在用户单击其他选项之一时仅通过代码取消选中它?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="product" value="all" />All Genders <br />
<input type="checkbox" name="product" value="women" />Women <br />
<input type="checkbox" name="product" value="men" />Men<br />
<input type="checkbox" name="product" value="bi" />Bi<br />

标签: javascriptjqueryhtml

解决方案


$(document).on("click", "input", function (evt) {
  if($(this).hasClass('selall')) {
    $('input').prop('checked', true);
  }
  else
  {
    $('.selall').prop('checked', false);
  }
  if ($('.gender:checked').length == $('.gender').length) {
    $('input').prop('checked', true);
  }
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<input type="checkbox" name="product" value="all" class="selall" />All Genders <br />
<input type="checkbox" name="product" value="women" class="gender" />Women <br />
<input type="checkbox" name="product" value="men" class="gender" />Men<br />
<input type="checkbox" name="product" value="bi" class="gender" />Bi<br />


推荐阅读