如何在jQuery中获得复选框的值?
当前回答
对于多于1个复选框,总是使用命名数组,如下例所示的国家,因为你知道国家可以选择多个,所以我使用name=" nations[]",而勾选复选框,你必须引用它的名字,如下例所示
var selectedCountries = ["Pakistan", "USA"]; $(document).ready(function () { $.each(selectedCountries, function (index, country) { $(`input[name='countries[]'][value='${country}']`).attr('checked', 'checked'); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <p> <input type="checkbox" name="countries[]" value="Pakistan"> Pakistan </p> <p> <input type="checkbox" name="countries[]" value="India"> India </p> <p> <input type="checkbox" name="countries[]" value="USA"> USA </p>
其他回答
试试这个小方法:
$("#some_id").attr("checked") ? 1 : 0;
or
$("#some_id").attr("checked") || 0;
$('#checkbox_id').val();
$('#checkbox_id').is(":checked");
$('#checkbox_id:checked').val();
对于多于1个复选框,总是使用命名数组,如下例所示的国家,因为你知道国家可以选择多个,所以我使用name=" nations[]",而勾选复选框,你必须引用它的名字,如下例所示
var selectedCountries = ["Pakistan", "USA"]; $(document).ready(function () { $.each(selectedCountries, function (index, country) { $(`input[name='countries[]'][value='${country}']`).attr('checked', 'checked'); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <p> <input type="checkbox" name="countries[]" value="Pakistan"> Pakistan </p> <p> <input type="checkbox" name="countries[]" value="India"> India </p> <p> <input type="checkbox" name="countries[]" value="USA"> USA </p>
检索复选框值的最佳方法如下所示
if ( elem.checked )
if ( $( elem ).prop( "checked" ) )
if ( $( elem ).is( ":checked" ) )
正如jQuery网站上的官方文档所解释的那样。其余的方法与复选框的属性无关,它们正在检查属性,这意味着它们正在测试加载复选框时的初始状态。简而言之:
当你有一个元素,你知道它是一个复选框,你可以简单地读取它的属性,你不需要jQuery(即element .checked),或者你可以使用$(elem).prop("checked"),如果你想依赖jQuery。 如果你需要知道(或比较)元素第一次加载时的值(即默认值),正确的方法是element . getattribute ("checked")或element .prop("defaultChecked")。
请注意,element .attr("checked")只有在jQuery 1.6.1+版本之后才会被修改,以返回与element .prop("checked")相同的结果。
有些答案是误导或不准确的,请自己检查以下内容:
http://api.jquery.com/prop/
请注意,截至今天,2018年,由于api多年来不断变化。 removeAttr已被撤销,不再工作!
Jquery选中或取消选中复选框:
糟糕,再也不能工作了。
$('#add_user_certificate_checkbox').removeAttr("checked");
$('#add_user_certificate_checkbox').attr("checked","checked");
相反,你应该这样做:
$('#add_user_certificate_checkbox').prop('checked', true);
$('#add_user_certificate_checkbox').prop('checked', false);
推荐文章
- 如何嵌入HTML到IPython输出?
- 如何删除/忽略:悬停css风格的触摸设备
- HTML5文本区域占位符不出现
- 添加javascript选项选择
- HTML tabindex属性是什么?
- 我如何捕捉Ajax查询后错误?
- HTML按钮调用MVC控制器和动作方法
- jQuery:什么是限制“数字”仅输入文本框的最佳方法?(允许使用小数点)
- 在window.setTimeout()发生之前取消/终止
- 如何在AngularJS中有条件地要求表单输入?
- Div高度100%,并扩展到适合内容
- 当鼠标经过表中的一行时,将光标更改为手
- HTML实体中间的点
- 检测当用户滚动到底部的div与jQuery
- 使用:before和:after CSS选择器插入HTML