Question

此示例：http://jsfiddle.net/jahn08/f7debwj2/27/它正常运行，将表2中的名称添加到表1中。

我想要的是当我点击框中选择所有内容时，我现在需要选择所有来选择所有名称，请参阅此图片：http://imgur.com/a/1gRwY

目标：

  <div class="col-md-6">select all or none
    <div class="btn-group">
      <div class="btn btn-default dropdown-toggle" data-toggle="dropdown">
        <input type="checkbox" name="vehicle1" value="Bike">
        <i class="fa fa-caret-down" aria-hidden="true"></i>
      </div>
      <ul class="dropdown-menu" role="menu">
        <li><a id="checkAll">All</a></li>
        <li><a id="uncheckAll">None</a></li>
      </ul>
    </div>
  </div>

如果我点击箭头并选择全部，这将选择所有名称

如果我点击箭头并选择无，取消选择所有名称

问题：

表2中的

：the select all or none。

点击箭头后点击

1：：<i class="fa fa-caret-down" aria-hidden="true"></i>并选择所有

<input type="checkbox" name="vehicle1" value="Bike">

应该选择

向用户显示所有选中的内容，此时此情况不会发生。

2 如果我点击箭头：<i class="fa fa-caret-down" aria-hidden="true"></i>并选择无，则：<input type="checkbox" name="vehicle1" value="Bike">应删除向用户显示的选项。

一切正常，我唯一的问题是这个

 <input type="checkbox" name="vehicle1" value="Bike">

此框不会显示是否已选择所有用户。

Answer 1

从下拉列表中选择元素时，可以通过编程方式设置“vehicle1”的值。

    function checkAll(check)
        {      
            ....
                $("[name=vehicle1]").attr('checked', check == 1);
                return false;
        }

Edited fiddle example

此外，您应该像处理下拉列表中的元素一样处理“vehicle1”。

Answer 2

这是小提琴 http://jsfiddle.net/f7debwj2/65/

基本上你需要为复选框添加一个id并更改checked属性

  $('#chk').prop('checked',check==1);

Answer 3

HTML
======================================================
<p class="select_all"> All Select</p>
<p class="select_none">None</p>
<input type="checkbox" name="chk[]" class="selection_chk" value="1">1<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="2">2<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="3">3<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="4">4<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="5">5<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="6">6<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="7">7<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="8">8<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="9">9<br>
<input type="checkbox" name="chk[]" class="selection_chk" value="10">10<br>


jQuery
======================================================
jQuery(document).ready(function(){
    jQuery('.select_all').click(function(){
        jQuery('.selection_chk').prop("checked",true);
    });
    jQuery('.select_none').click(function(){
        jQuery('.selection_chk').prop("checked",false);
    });
});

Jquery make input复选框从表中选择所有用户

3 个答案: