jquery无法设置checkbox选中即没有变成选中状态

代码如下:

$("input").attr("checked","checked")

设置以后checkbox并没有变成选中状态，用chrome调试看了一下，checkbox中确实有checked属性，而且，值为checked，但是页面显示仍然为未选中状态


代码如下:

$("input").prop("checked",true);

ttributes和properties之间的差异在特定情况下是很重要。jQuery 1.6之前 ，.attr()方法在取某些 attribute 的值时，会返回 property 的值，这就导致了结果的不一致。从 jQuery 1.6 开始， .prop()方法 方法返回 property 的值,而 .attr() 方法返回 attributes 的值。

例如, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 和 defaultSelected 应使用.prop()方法进行取值或赋值。 在jQuery1.6之前，这些属性使用.attr()方法取得，但是这并不是元素的attr属性。他们没有相应的属性（attributes），只有特性(property)。

例如，考虑一个DOM元素的HTML标记中定义的<input type="checkbox" checked="checked" /> ，并假设它是一个JavaScript变量命名的elem ：

elem.checked true (Boolean) 将改变复选框的状态
$(elem).prop("checked") true (Boolean) 将改变复选框的状态
elem.getAttribute("checked") "checked" (String) 不会改变的复选框的初始状态;
$(elem).attr("checked") (1.6) "checked" (String) 不会改变的复选框的初始状态;
$(elem).attr("checked") (1.6.1+) "checked" (String) 将改变复选框的状态
$(elem).attr("checked") (pre-1.6) true (Boolean) 将改变复选框的状态
根据W3C的表单规范 ，在checked属性是一个布尔属性，这意味着只要该 attribute 存在，即使它没有值，或是一个空字符串，该属性对应的 property 就是 true。以下推荐的是兼容浏览器方式，判断 checkbox 元素的 checked 属性是否为"真" 的方法：


代码如下:

if ( elem.checked )
if ( $(elem).prop("checked") )
if ( $(elem).is(":checked") )

如果你使用jQuery 1.6 ，代码if ( $(elem).attr("checked") )，将获得一个属性(attribute) ，它不改变该复选框被选中和选中。它只是用来存储默认或选中属性的初始值。为了保持向后兼容，.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外，还会更新 property 属性，因此 boolean attribute（布尔属性）不需要通过 .prop() 来改变其值。推荐使用上述方法之一，来取得 checked 的值。

赞 (0)

相关推荐

  • jQuery中获取checkbox选中项等操作及注意事项

    jQuery中获取checkbox选中项等操作及注意事项

    1. 获取checkbox的选中项 2. checkbox选项的全选 反选操作 用于测试的checkbox代码段: 复制代码 代码如下: <div>            <input type="checkbox" name="abc" value="一年级" id="in1" checked="checked" /><label for="in1">

  • Jquery遍历checkbox获取选中项value值的方法

    源码: 复制代码 代码如下: jQuery(function($){ $("input[name='key']:checkbox").click(function(){ var ids = ''; var flag = 0; $("#ids").attr("value",ids); $("input[name='key']:checkbox").each(function(){ if (true == $(this).attr

  • jQuery点击tr实现checkbox选中的方法

    jQuery点击tr实现checkbox选中的方法

    标题描述的有点不贴切,但希望大家能够明白,为了更形像的表达,我特意录制了一张GIF动画图片. 我不知道实际开发中有没有用到这种效果,但我个人认为,这种方式更人性化,因为只要点到一行,就可以使CheckBox.checked=true: 不用非得点复选按钮才能实现; 实现的过程有点纠结,试了几次都没成,最后用了一个笨笨的方法,就是点击行的时候,让他的子元素(td)的背景颜色为红色.(因为我用到了光棒效果,如果我点击行(td)的时候,颜色是变了,但鼠标一离开的时候就又变回原来的颜色了) 可能你会问我

  • jquery判断checkbox(复选框)是否被选中的代码

    复制代码 代码如下: //是否被选中验证有选中的return true,否return false function mycheckbox() { var falg = 0; $("input[name='soft[]']:checkbox").each(function () { if ($(this).attr("checked")) { falg += 1; } }) if (falg > 0) return true; else return fals

  • jQuery操作CheckBox的方法介绍(选中,取消,取值)

    复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">   <HTML>    <HEAD>     <TITLE> New document．nbsp;</TITLE>     <meta http-equiv="Content-Type" content="text/html; charset=U

  • jQuery判断checkbox(复选框)是否被选中以及全选、反选实现代码

    jQuery判断checkbox(复选框)是否被选中:if($("#id").attr("checked")==true) jQuery实现checkbox(复选框)选中.全选/反选代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transiti

  • jQuery实现点击行选中或取消CheckBox的方法

    本文实例讲述了jQuery实现点击行选中或取消CheckBox的方法.分享给大家供大家参考,具体如下: /// <summary> /// 点击行选中或者取消CheckBox /// </summary> /// <param name="TableID">表ID</param> function SetCheckBox_Check(TableID) { var $TableID = TableID == "" ? &

  • jQuery将所有被选中的checkbox某个属性值连接成字符串的方法

    本文实例讲述了jQuery将所有被选中的checkbox某个属性值连接成字符串的方法.分享给大家供大家参考.具体如下: 需求: 对于一组checkbox,当点击每个checkbox后,把当前处于选中状态的checkbox的某个属性值取出来连接成字符串,并以逗号分开. 实现方法: html部分: 复制代码 代码如下: <input type="checkbox" id="1"/> <label for="1">选项一<

  • jQuery判断checkbox是否选中的3种方法

    网上大多数文章都提供的方法都是无效的,害死个人,本文中的方法小编亲测试有效,建议使用方法二: 方法一: if ($("#checkbox-id")get(0).checked) {     // do something } 方法二: if($('#checkbox-id').is(':checked')) {     // do something } 方法三: if ($('#checkbox-id').attr('checked')) {     // do something

  • jquery无法设置checkbox选中即没有变成选中状态

    复制代码 代码如下: $("input").attr("checked","checked") 设置以后checkbox并没有变成选中状态,用chrome调试看了一下,checkbox中确实有checked属性,而且,值为checked,但是页面显示仍然为未选中状态 复制代码 代码如下: $("input").prop("checked",true); ttributes和properties之间的差异在特

  • JQuery 设置checkbox值二次无效的解决方法

    在此MVC ASP.NET 项目,我利用jquery ajax传输数据给后台controller控制层,返回数据给JQuery数据. 首先必须清除checkbox的选中,因为是ajax的异步操作,是不刷新页面的,所以需要手段充值控件值,使得其为空,不影响下次的拿到数据显示. 言归正传,$("#checkboxID").attr('checked', false);//设置checkbox为不选中状态, $("#checkboxID").attr('checked',

  • bootstrap 设置checkbox部分选中效果

    bootstrap 设置checkbox部分选中效果

    在很多页面都会需要根据加载的数据来控制checkbox是否选中,以前的方法在这个UI里并不适用,现贴下两种代码供大家参考. 前提条件:该字段在数据库中是以","间隔的字符串,如:"WIFI,电视,有线宽带" 第一种:普通checkbox var servicesArray = data.Services.split(",");//数据库里获取到的值 $("input[type=checkbox][name=chkServices]&qu

  • 使用jQuery动态设置单选框的选中效果

    一.需要实现的效果 这里使用jQuery来实现.需要实现的效果如下:当下拉条改变时,单选框选中的值随之变化. <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>动态设置单选框的选中</title> <!-- 作者:Harrison 时间:2018-12-05 描述:当下拉条改变时,动态的设置单选框的值 --> </head&

  • Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码

    Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码

    由于Jquery的版本更新很快,代码的写法也改变了许多,以下Jquery代码适query1.4版本以上Radio 1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); 2.设置第一个Radio为选中值: $('input:radio:first').attr('check

  • Jquery操作radio,checkbox,select表单操作实现代码

    Jquery操作radio,checkbox,select表单操作实现代码

    一 .Select jQuery获取Select选择的Text和Value: 1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 3. var checkValue=$("#s

  • LayUI动态设置checkbox不显示的解决方法

    1.页面引入layui.js和layui.css <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>手机银行权限配置</title> <link type="text/css" rel="stylesheet" href="common/layui/css/layui.css" r

  • Struts html:checkbox框初始默认是选中的解决方法

    在使用struts标签html:checkbox 的时候,如何让checkbox框默认是选中的,一般情况下都是当Formbean里面该Property的值和标签上value给定的值相等的时候,生成的jsp页面上才是选中的. 在Struts中几种情况可以使标签初始就是选中的,Formbean里面该Property的值设为 1.on .2.yes .3.true 这三种情况都是可以实现默认选中的. 注:如果不选中,最好把Property的设置为"",因为在Action中得到Property

  • 浅谈jQuery中的checkbox问题

    一开始的代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>复选框</title> <script src="https://cdn.bootcss.com/jquery/3.1.0/jquery.min.js"></script> <script t

  • 使用jQuery获取radio/checkbox组的值的代码收集

    复制代码 代码如下: <!-- $("document").ready(function(){ $("#btn1").click(function(){ $("[name='checkbox']").attr("checked",'true');//全选 }) $("#btn2").click(function(){ $("[name='checkbox']").removeAtt

随机推荐