jquery,attr,prop,checkbox标签已有checked=checked但是不显示勾选
最近在做项目的过程中碰到了这样的一个问题:在使用bootstrap模态框的过程中,在模态框中有一个checkbox标签,一开始是为选中的,当点击触发模态框按钮,选中chcekbox时,会显示勾选,这个时候将选中的状态缓存起来,然后点击模态框中的关闭按钮,再次点击触发模态框按钮弹出模态框,这个时候问题出现了:
checkbox标签已有checked=checked但是不显示勾选,网上也查过有解决方案,就是将
$("...").attr("checked", true)改为$("...").prop("checked",
true),问题解决,但是,问题是解决了,那么原因是出现在哪里呢?
首先来了解下 jquey中的 attr()函数和prop()函数,attr()是处理
attribute的值的,而prop()是处理 property 的值的 ,jQuery 1.6之前 ,.attr()方法在取某些
attribute 的值时,会返回 property 的值,这就导致了结果的不一致。从 jQuery 1.6 开始, .prop()方法
方法返回 property 的值,而 .attr() 方法返回 attributes 的值,那么归根结底,就是在处理 attribute 和
property。
很多attribute节点有一个相应的property属性,因而attribute和property很容易被混淆在一起,如某个div元素中的id和class既是attribute也有property,不管哪种方式都可以访问和修改,但是对于自定义的attribute节点,或者自定义property,两者就没有关系了(但是在IE6-7中,两者还是一样的,好奇葩的,但愿我们都能早日抛弃IE8以下的),需要注意的是,对于checked特性(attribute)不是对应它checked属性(property),attribute实际对应的是defaultChecked属性,而且仅用于设置复选框最初的值,checked的attribute不会因为复选框的状态而改变,而checked的property会因为复选框的状态而改变,所以在.attr()函数中,就算设置成了.attr("checked",
true),也只是用来存储默认或者选中属性的默认值,却并不改变该复选框被选中和选中,这就是为什么
checkbox标签已有checked=checked但是不显示勾选 的原因所在
选择:
$("#isremind").prop("checked",true);
取消选择:
$("#isremind").removeAttr("checked");
jquery,attr,prop,checkbox标签已有checked=checked但是不显示勾选的更多相关文章
- checkbox标签已有checked=checked属性但是不显示勾选
点击全选按钮,选中下面的列表,再次点击取消选择. 第一次的使用的方法是$("input[name=xxx]").attr('checked',true); 但是往往刷新页面第一次点 ...
- JQUERY attr prop 的区别 一个已经被淘汰
在做jquery 全选 全不选的项目中, 1..prop( propertyName ) 获取匹配集合中第一个元素的Property的值 2. .prop( propertyName, value ) ...
- checkbox属性checked="checked"但状态不是勾选状态的解决办法
原因: jQuery API明确说明,1.6+的jQuery要用prop,不能用attr否则无效,尤其是checkBox的checked的属性的判断.
- firefox(火狐)下 js中设置checkbox属性checked="checked"已有,但复选框却不显示勾选的原因
刚看到问题时以为是浏览器兼容性的原因,ie.google都能正常显示. 网上查询之后发现是jQuery的attr()方法用的不恰当. jQuery1.6之前使用attr()可以修改 ,从jQuery ...
- jquery attr处理checkbox / select 等表单元素时的坑
先上html结构 <body> <form action=""> <input type="checkbox" id=" ...
- jquery attr处理checkbox / select 等表单元素时只能使用一次的坑
先上html结构 <body> <form action=""> <input type="checkbox" id=" ...
- jQuery attr() prop() data()用法及区别
.attr(),此方法从jq1.0开始一直存在,官方文档写的作用是读/写DOM的attribute值,其实1.6之前有时候是attribute,有时候又是property..prop(),此方法jq1 ...
- firefox中 checkbox属性checked="checked"已有,但复选框却不显示打钩的原因
最近在调试复选框的应用,在ie没有问题,考虑到兼容性,试试了firefox,遇到了问题. 复选框绑定了click事件,点一次选中,再点击取消选中,依次类推.这个功能在ie中没问题,但是在firefox ...
- jquery一键控制checkbox全选,反选,全不选。
jquery attr()方法获取标签的 checked 会有问题,所以用了 prop() 方法. Hml的checkbox没有加name,只用了 div 嵌套. 如有更好的方法,望指点!! //全选 ...
随机推荐
- rabbitMQ 的三种Exchange
rabbitMQ 的Exchange有3种路由方式: direct.fanout.topic ,以下为详细说明 1. Direct Exchange 处理路由键.需要将一个队列绑定到交换机上,要求 ...
- linux中执行shell命令的几种常用方法
1 切换到shell脚本所在目录执行shell脚本: cd /test/shell ./test.sh 2 以绝对路径的方式执行shell脚本: /test/shell/test.sh 3 直接使用b ...
- 页面系统,浏览器检测- 网页基础模块(JavaScript)
// 浏览器检测,获取,弹出框提醒IE 返回浏览器详情 function GetbrowserSys() { var BrowserMatch = { init: function() { this. ...
- 数据结构与算法之PHP排序算法(插入排序)
一.基本思想 插入排序算法是每一步将一个待排序的数据插入到前面已经排好序的有序序列中,直到所有元素插入完毕为止. 二.算法过程 1)将第一个元素看做一个有序序列,把第二个元素到最后一个元素当成是未 ...
- 使用nginx作为webservice接口代理
通常情况下,企业并不会直接开放系统接口给到外网,并且在企业内部同样有SOA或者ESB这样的接口统一管理的工具. 那么,大多数情况下,如果需要与外部系统,如云系统,或者其他企业的系统做接口时采取的方式如 ...
- Vue.js 基本功能了解一下~
一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...
- vscode keys
// 快捷键设置 keyiing.json // 将键绑定放入此文件中以覆盖默认值 [ /* // 转换大写 { "key" : "ctrl+shift+u", ...
- 小程序都报wxss编译错误
解决方法: 在控制台输入openVendor() ,清除里面的wcc.exe wcsc.exe 然后重启工具
- Mysql 截取日期的方法
//显示年月日 select date_format(date ,'%Y-%m-%d' ) from talbe_a //根据年月日分组 select date_format(date ,'%Y-%m ...
- python函数进阶(函数参数、返回值、递归函数)
函数进阶 目标 函数参数和返回值的作用 函数的返回值 进阶 函数的参数 进阶 递归函数 01. 函数参数和返回值的作用 函数根据 有没有参数 以及 有没有返回值,可以 相互组合,一共有 4 种 组合形 ...