如何在jQuery中获得复选框的值?
当前回答
尽管这个问题需要jQuery解决方案,但这里有一个纯JavaScript的答案,因为没有人提到过它。
没有jQuery:
只需选择元素并访问选中的属性(返回布尔值)。
var checkbox = document.querySelector('input[type=“checkbox”]'); 警报(复选框.选中); <输入类型=“复选框”/>
下面是一个快速监听change事件的例子:
var checkbox = document.querySelector('input[type="checkbox"]'); 复选框。addEventListener('change',函数(e) { 警报(this.checked); }); < input type = "复选框" / >
要选择选中的元素,使用:checked伪类(input[type="checkbox"]:checked)。
下面是一个迭代检查的输入元素并返回已检查元素名称的映射数组的示例。
例子
var elements = document.querySelectorAll('input[type="checkbox"]:checked');
var checkedElements = Array.prototype.map.call(elements, function (el, i) {
return el.name;
});
console.log(checkedElements);
var elements = document.querySelectorAll('input[type="checkbox"]:checked'); var checkedElements = Array.prototype.map.call(elements, function (el, i) { return el.name; }); console.log(checkedElements); <div class="parent"> <input type="checkbox" name="name1" /> <input type="checkbox" name="name2" /> <input type="checkbox" name="name3" checked="checked" /> <input type="checkbox" name="name4" checked="checked" /> <input type="checkbox" name="name5" /> </div>
其他回答
$("input[name='gender']:checked").val();
这适用于我的情况,任何寻找简单方法的人都必须尝试这种语法。 谢谢
//By each()
var testval = [];
$('.hobbies_class:checked').each(function() {
testval.push($(this).val());
});
//by map()
var testval = $('input:checkbox:checked.hobbies_class').map(function(){
return this.value; }).get().join(",");
//HTML Code
<input type="checkbox" value="cricket" name="hobbies[]" class="hobbies_class">Cricket
<input type="checkbox" value="hockey" name="hobbies[]" class="hobbies_class">Hockey
例子 演示
在jquery中获取checkboxex的值:
var checks = $("input[type='checkbox']:checked"); // returns object of checkeds.
for(var i=0; i<checks.length; i++){
console.log($(checks[i]).val()); // or do what you want
});
在pure js中:
var checks = document.querySelectorAll("input[type='checkbox']:checked");
for(var i=0; i<checks.length; i++){
console.log(checks[i].value); // or do what you want
});
要获取value属性的值,你可以这样做:
$("input[type='checkbox']").val();
或者如果你已经为它设置了一个类或id,你可以:
$('#check_id').val();
$('.check_class').val();
然而,无论是否检查,都会返回相同的值,这可能会令人困惑,因为它与提交的表单行为不同。
要检查是否已检查,请执行以下操作:
if ($('#check_id').is(":checked"))
{
// it is checked
}
试试这个小方法:
$("#some_id").attr("checked") ? 1 : 0;
or
$("#some_id").attr("checked") || 0;
推荐文章
- 在网页上用鼠标模拟震颤(例如帕金森病)?
- Bootstrap抛出Uncaught错误:Bootstrap的JavaScript需要jQuery
- 如何改变文本区域的边框颜色:焦点
- 我如何设置背景颜色为文本的宽度,而不是整个元素的宽度,使用CSS?
- 如何删除和清除所有的本地存储数据
- 强制打开“另存为…”弹出打开文本链接点击PDF在HTML
- 如何修改标签文本?
- 如何获得十六进制颜色值而不是RGB值?
- 如何将一个标题转换为jQuery的URL段塞?
- $(window).width()与媒体查询不一样
- AJAX请求中的内容类型和数据类型是什么?
- 如何打破_。在underscore.js中的每个函数
- 在HTML中还有其他有用的空格码吗,比如半空格的 , em-spaces, en-spaces等等?
- 如何在jQuery中获得当前日期?
- 输入触发器按钮单击