首页 > 解决方案 > 在控制台中记录复选框的值

问题描述

我希望控制台在每次选中或取消选中复选框时记录。我目前的方法有什么问题?这不会向控制台打印任何内容。

$(document).ready(function(){
    console.log("loaded");
});

var $filterCheckboxes = $('input[type="checkbox"]');
$filterCheckboxes.on('change', function() {
  $filterCheckboxes.filter(":checked").each(function() {
    console.log(this.value);
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li class="">
  <div class="checkbox-group">
    <input type="checkbox" name="name_1" value="value1" id="id_1">
    <label for="name_1">
      <span class="check"></span>
      <span class="box"></span>
      Name 1
    </label>
  </div>
</li>

标签: javascripthtmljquery

解决方案


您实际上不需要使用该filter()功能,试试这个:

var $filterCheckboxes = $('input[type="checkbox"]');
$filterCheckboxes.on('change', function(){
        console.log($(this).val());
});

val()函数获取一组复选框的当前选中值。您可能想通过使用它们上的属性来指定要记录的复选框集name,例如:

name="common_boxes"

并且不要将 和 的某些组件混合在一起也是一个好习惯JavascriptjQuery就像element.value应该替换为一样element.val(),就像上面的代码片段一样。我再次强调,这样做只是一个好习惯,但你可以随意使用


推荐阅读