jquery attr方法获取input的checked属性问题


Posted in Javascript onMay 26, 2014

问题:经常使用jQuery插件的attr方法获取checked属性值,获取的值的大小为未定义,此时可以用prop方法获取其真实值,下面介绍这两种方法的区别:

1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase

<input type="checkbox" id="selectAll" onclick="checkAll()">全选 
function checkAll() 
{ 
var checkedOfAll=$("#selectAll").prop("checked"); 
alert(checkedOfAll); 
$("input[name='procheck']").prop("checked", checkedOfAll); 
}

2.如果使用attr方法获取时,如果当前input中初始化未定义checked属性,则不管当前是否选中,$("#selectAll").attr("checked")都会返回undefined;
<input type="checkbox" id="selectAll" onclick="checkAll()" >全选

如果当前input中初始化已定义checked属性,则不管是否选中,$("#selectAll").attr("checked")都会返回checked.
<input type="checkbox" id="selectAll" onclick="checkAll()" checked>全选 
function checkAll() 
{ 
var checkedOfAll=$("#selectAll").attr("checked"); 
alert(checkedOfAll); 
$("input[name='procheck']").attr("checked", checkedOfAll); 
}

总结,如果使用jquery,应使用prop方法来获取和设置checked属性,不应使用attr.
Javascript 相关文章推荐
学习js所必须要知道的一些
Mar 07 Javascript
借助script进行Http跨域请求:JSONP实现原理及代码
Mar 19 Javascript
jquery实现点击消失的代码
Mar 03 Javascript
浅析JavaScript中的事件机制
Jun 04 Javascript
jquery+CSS3模拟Path2.0动画菜单效果代码
Aug 31 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
Jul 17 Javascript
vue仿淘宝订单状态的tab切换效果
Jun 23 Javascript
微信小程序项目实践之九宫格实现及item跳转功能
Jul 19 Javascript
vue鼠标移入添加class样式,鼠标移出去除样式(active)实现方法
Aug 22 Javascript
提升node.js中使用redis的性能遇到的问题及解决方法
Oct 30 Javascript
微信小程序 确认框的实现(附代码)
Jul 23 Javascript
在Layui 的表格模板中,实现layer父页面和子页面传值交互的方法
Sep 10 Javascript
jQuery表格排序组件-tablesorter使用示例
May 26 #Javascript
jQuery实现鼠标可拖动调整表格列宽度
May 26 #Javascript
js处理表格对table进行修饰
May 26 #Javascript
利用jQuery实现可以编辑的表格
May 26 #Javascript
js实现简单的购物车有图有代码
May 26 #Javascript
js函数参数设置默认值的一种变通实现方法
May 26 #Javascript
单元选择合并变色示例代码
May 26 #Javascript
You might like
php定时删除文件夹下文件(清理缓存文件)
2013/01/23 PHP
php一行代码获取文件后缀名实例分析
2014/11/12 PHP
网站防止被刷票的一些思路与方法
2015/01/08 PHP
PHP实用小技巧之调用录像的方法
2019/12/05 PHP
解析JavaScript中的不可见数据类型
2013/12/02 Javascript
JS数字抽奖游戏实现方法
2015/05/04 Javascript
关于JS中prototype的理解
2015/09/07 Javascript
AngularJS通过$http和服务器通信详解
2016/09/21 Javascript
jQuery Ajax File Upload实例源码
2016/12/12 Javascript
jquery实现图片平滑滚动详解
2017/03/22 jQuery
在js中做数字字符串补0(js补零)
2017/03/25 Javascript
JavaScript脚本语言是什么_动力节点Java学院整理
2017/06/26 Javascript
利用Ionic2 + angular4实现一个地区选择组件
2017/07/27 Javascript
angular2中Http请求原理与用法详解
2018/01/11 Javascript
js DOM的事件常见操作实例详解
2019/12/16 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
Python算法之栈(stack)的实现
2014/08/18 Python
Linux中Python 环境软件包安装步骤
2016/03/31 Python
Python中的探索性数据分析(功能式)
2017/12/22 Python
在IPython中进行Python程序执行时间的测量方法
2018/11/01 Python
利用arcgis的python读取要素的X,Y方法
2018/12/22 Python
Python字典的基本用法实例分析【创建、增加、获取、修改、删除】
2019/03/05 Python
python实现简单的购物程序代码实例
2020/03/03 Python
python实现程序重启和系统重启方式
2020/04/16 Python
使用Python pip怎么升级pip
2020/08/11 Python
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
马来西亚和新加坡巴士票在线预订:CatchThatBus
2018/11/17 全球购物
数据库方面面试题
2012/04/22 面试题
多媒体编辑专业毕业生推荐信
2013/11/05 职场文书
业务员薪酬管理制度
2014/01/15 职场文书
《诚实与信任》教学反思
2014/04/10 职场文书
酒店优秀员工事迹材料
2014/06/02 职场文书
2014年小学国庆节活动方案
2014/09/16 职场文书
党的群众路线教育实践活动领导班子整改措施
2014/09/30 职场文书
Python一行代码实现自动发邮件功能
2021/05/30 Python
关于React Native 无法链接模拟器的问题
2021/06/21 Javascript