javascript - 在控制台中记录复选框的值
问题描述
我希望控制台在每次选中或取消选中复选框时记录。我目前的方法有什么问题?这不会向控制台打印任何内容。
$(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>
解决方案
您实际上不需要使用该filter()
功能,试试这个:
var $filterCheckboxes = $('input[type="checkbox"]');
$filterCheckboxes.on('change', function(){
console.log($(this).val());
});
该val()
函数获取一组复选框的当前选中值。您可能想通过使用它们上的属性来指定要记录的复选框集name
,例如:
name="common_boxes"
并且不要将 和 的某些组件混合在一起也是一个好习惯Javascript
,jQuery
就像element.value
应该替换为一样element.val()
,就像上面的代码片段一样。我再次强调,这样做只是一个好习惯,但你可以随意使用
推荐阅读
- reactjs - 从外部接口属性借用 JSDoc 注释
- r - 似乎无法合并两个中等大小的稀疏矩阵,试图理解错误
- python - 为什么我的 Tkinter 按钮不执行我的功能?
- r - 从 r 中较大字符串的中间提取一串数字(长度不同)
- performance - Jupyter 单元魔术时间它没有显示实际运行时间
- python - 从 tenserflow v.1 升级到 v.2 tf.contrib.opt.scipyoptimizerinterface
- python - 是否可以从一个 discord.py 机器人系统为多个不和谐机器人帐户提供服务?
- c++ - 需要 Qt3DWindow 来忽略键盘事件
- java - AWS SDK GetParameter 通过使用 roleArn 而不是
- vue.js - 如何在 VueJS 中测试样式 css 自定义 var