如何获得“已检查”复选框的长度

时间:2019-07-01 07:46:07

标签: jquery checkbox

尝试获取复选框的长度,但全部选中时为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>

2 个答案:

答案 0 :(得分: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">

答案 1 :(得分:0)

您需要删除$('.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>