jquery利用attr、prop方法获取、设置input的checked属性

在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr,需要的朋友可以参考下。

1、prop方法获取、设置checked属性
<input type="checkbox" name="checkboxMain" οnclick="CheckAll(this);" />
function CheckAll(obj) {
   //获取checked属性
   if ($(obj).prop("checked")) {
      //设置checked属性
      $("input[name=‘checkboxall‘]").prop("checked", true);
   } else {
      //设置checked属性
      $("input[name=‘checkboxall‘]").prop("checked",false);                                
   }
}
1
2
3
4
5
6
7
8
9
10
11
当input控件checkbox设置了checked属性时,无论checked=”“或
checked=”checked”,$(obj).prop(“checked”)的结果都是true;
当input控件checkbox没设置checked属性时,$(obj).prop(“checked”)的结果是false。
设置$(“input[name=’checkboxall’]”).prop(“checked”, true)时,checkbox会被选中;
设置$(“input[name=’checkboxall’]”).prop(“checked”, false)时,checkbox不会被选中;

2、attr方法获取、设置checked属性
<input type="checkbox" id="selectAll" onclick="checkAll()" >全选
如果当前input中初始化未定义checked属性,则不管当前是否选中,$(“#selectAll”).attr(“checked”)都会返回undefined;
<input type="checkbox" id="selectAll" checked="" onclick="checkAll()" >全选
<input type="checkbox" id="selectAll" checked="checked"
onclick="checkAll()" >全选
如果当前input中初始化定义了checked属性,无论checked=”“或
checked=”checked”,当前checkbox都处于选中状态,
$(“#selectAll”).attr(“checked”)都会返回”checked”;

3、总结
在jquery中应该使用prop方法来获取和设置checked属性,不应该使用attr。
这篇文章写得较早,之后我又写了一篇文章来解释jQuery中prop和attr的区别,如果大家有需要的话请移步
http://blog.csdn.net/xiaouncle/article/details/53959496。

4、jquery版本原因
jquery-1.4.1.min.js、jquery-1.4.2.min.js可以用attr方法正确地获取或设置checkbox的checked属性,但是高版本例如:1.10.2.min.js就不能用attr方法正确地获取或设置checkbox的checked属性,在此声明:其他版本没有测试。
jquery-1.4.1.min.js文件下载地址:http://download.csdn.net/detail/xiaouncle/9585180
jquery-1.4.2.min.js文件下载地址:http://download.csdn.net/detail/xiaouncle/9585205

原文地址:https://www.cnblogs.com/zhuyeshen/p/12151781.html

时间: 2024-10-22 12:53:26

jquery利用attr、prop方法获取、设置input的checked属性的相关文章

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

问题:经常使用jQuery插件的attr方法获取checked属性值,获取的值的大小为未定义,此时可以用prop方法获取其真实值,下面介绍这两种方法的区别: 1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase <input type="checkbox" id="selectAll" onclick="checkAll()">全选 function checkAll

jQuery中使用attribute,prop获取,设置input的checked值

1.prop方法获取.设置checked属性 当input控件checkbox设置了checked属性时,无论checked=""或 checked="checked",$(obj).prop("checked")的结果都是true: 当input控件checkbox没设置checked属性时,$(obj).prop("checked")的结果是false. 设置$("input[name='checkboxall'

jQuery中使用attribute,prop获取,设置input的checked值【转】

1.prop方法获取.设置checked属性 当input控件checkbox设置了checked属性时,无论checked=""或 checked="checked",$(obj).prop("checked")的结果都是true: 当input控件checkbox没设置checked属性时,$(obj).prop("checked")的结果是false. 设置$("input[name='checkboxall'

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

问题:经常使用jQuery插件的attr方法获取checked属性值,获取的值的大小为未定义,此时可以用prop方法获取其真实值,下面介绍这两种方法的区别: 1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase . 代码如下: <input type="checkbox" id="selectAll" onclick="checkAll()">全选 function

[ jquery 方法 removeAttr(name) | removeProp(name) ] 此方法用来删除对应的由.attr() | .prop()方法设置的属性集

用来删除由.attr() | .prop()方法设置的属性集: 随着一些内置属性的DOM元素或window对象,如果试图将删除该属性,浏览器可能会产生错误.jQuery第一次分配undefined值的属性,而忽略了浏览器生成的任何错误 实例: <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title> <meta http-equiv='descrip

jQuery中attr,prop区别

前2篇jQuery笔记中,分别总结了jQuery中attr()和prop()的用法,大家可能会发现这两个方法在使用起来非常类似 没有看过的童鞋可移步:attr()用法  http://www.cnblogs.com/zwwhnly/p/7383960.html   prop()用法 http://www.cnblogs.com/zwwhnly/p/7389295.html 本篇笔记主要总结下attr(),prop()之间的区别 假使页面上如如下Html标签: <input type="ch

jquery 设置checkbox的checked属性 总是出问题

所使用的jquery版本为jquery-1.9.1,浏览器为Chrome 1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase <input type="checkbox" id="selectAll" onclick="checkAll()">全选 function checkAll() {   var checkedOfAll=$("#selectAll

jquery中attr() &amp; prop() 的区别与其实现方法

$(function(){ $('#check').attr('checked'); // undefind ???一头雾水 }) 在jquery中 attr 本来就是用来设置或者获取属性的,可是上面的方法却返回给 undefined ? 然后我尝试用 $('#check').prop('checked'); 发现可以正常运行!! 在jquery中prop是相对来说版本比较新的一个方法,乍一看它的功能好像和attr没有什么很大的差别,的确,它们都可设置或者来获取属性,比如 $('#div').a

jquery:attr()的方法

设置属性 $("#id").attr("checked",true); //attr() 方法也允许您同时设置多个属性. $("#id").attr({ "href" : "http://www.runoob.com/jquery", "title" : "jQuery 教程" }); //也提供回调函数.回调函数有两个参数:被选元素列表中当前元素的下标,以及原始(旧