如何获得选中的复选框长度答案

【问题标题】：How to get Checked check boxes length如何获得选中的复选框长度
【发布时间】：2019-07-01 07:46:07
【问题描述】：

试图获取选中的复选框长度，但在它们都被选中时得到 0。

我有一个表，它的行包含 td 的复选框。每个输入类型复选框都有类名“check”。

在表格外有主复选框，负责选择/取消选择表格内的所有复选框。

现在我想看看点击按钮是否至少选中了一个复选框。

var allCheckBoxes = $('.check :checkbox:checked');
console.log(allCheckBoxes.length);

除了零之外什么都没有:(

            <table id="checkboxTable" class="table table-bordered">
            <tbody>
                <tr>
                    <th>Table name</th>
                    <th>Gen A</th>
                    <th>Gen B</th>
                    <th>Actions</th>
                </tr>

            @foreach($data as $k => $table)
            <tr class="trcheck" id="{{$table}}">
                <td>{{$table}}</td>
                <td><input type="checkbox" name="{{$table}}[]" value="controller" class="check"></td>
                <td><input type="checkbox" name="{{$table}}[]" value="model" class="check"></td>
                <td>
                    <button onclick="checkbox_gen_object(this);" id="{{'genbtn'.$i}}" class="genSingle btn btn-primary">
                        Generate
                    </button>
                </td>

            </tr>

            @endforeach

        </tbody>
    </table>

【问题讨论】：

如果这是真的：Each input type checkbox has class name " check ". 那么你的 allCheckBoxes 变量的长度不能是 0
如果没有你的 html，我可以肯定地说，但试试 $('.check:checkbox:checked'); 猜测你的复选框有 check 类
对不起，我没有找到你
在下面查看我的答案，它一定会对你有所帮助。

标签： jquery checkbox

【解决方案1】：

function myfunction(){
var mylength=$(".a").filter(':checked').length;
alert(mylength);
$("#leng").val(mylength);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  
  
  length: <input type="text" id="leng" name="user"><br>
  I have a bike: <input type="checkbox" class="a" name="vehicle" value="Bike"><br>
  I have a car: <input type="checkbox" class="a" name="vehicle" value="Car"><br>
  I have an airplane: <input type="checkbox" class="a" name="vehicle" value="Airplane"><br>
  <input id="btn" onclick="myfunction()" type="button" value="test">

【讨论】：

【解决方案2】：

您需要删除$('.check :checkbox:checked') 中的空格，因为您的类check 的对象是您的复选框；

您也不需要:checkbox 选择器，只需使用$('.check:checked').length

工作演示

function checkbox_gen_object(obj){
  console.log($('.check:checked').length)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="checkboxTable" class="table table-bordered">
  <tbody>
    <tr>
      <th>Table name</th>
      <th>Gen A</th>
      <th>Gen B</th>
      <th>Actions</th>
    </tr>

    <tr class="trcheck" id="{{$table}}">
      <td>{{$table}}</td>
      <td><input type="checkbox" name="{{$table}}[]" value="controller" class="check"></td>
      <td><input type="checkbox" name="{{$table}}[]" value="model" class="check"></td>
      <td>
        <button onclick="checkbox_gen_object(this);" id="{{'genbtn'.$i}}" class="genSingle btn btn-primary">
                        Generate
                    </button>
      </td>

    </tr>

    <tr class="trcheck" id="{{$table}}">
      <td>{{$table}}</td>
      <td><input type="checkbox" name="{{$table}}[]" value="controller" class="check"></td>
      <td><input type="checkbox" name="{{$table}}[]" value="model" class="check"></td>
      <td>
        <button onclick="checkbox_gen_object(this);" id="{{'genbtn'.$i}}" class="genSingle btn btn-primary">
                        Generate
                    </button>
      </td>

    </tr>

  </tbody>
</table>

【讨论】：