【jquery】checkbox选中事件

2023年6月21日发(作者：)

【jquery】checkbox选中事件查了⼀下貌似⽤最新的或者版本较⾼的jquery 请⽤下⾯的代码获取是否是选中$('#checkboxId').is(':checked')或者⽤$('#checkboxId').attr('checked') =="checked" 关于这⼀条 根据jquery版本的不同会出现验证不出来的情况今天⽤到了动态调整checkbox:⾸先得知道javascript中property 和attribute的区别： 这个链接还有其他的内容 也可以学习下查了jquery API 资料如下： ⼤概翻译⼀下： 原⽂:As of jQuery 1.6, the

.attr() method returns

undefined for attributes that have not been set. To retrieve and change DOM properties such asthe

checked,

selected, or

disabled state of form elements, use the method. 译: 对于1.6版本的jquery .attr()⽅法返回的是undefined 若没有设置attributes的话.要想获得和改变类似checked selected disabled 表单状态元素,请使⽤prop()⽅法Attributes vs. Properties属性 vs 值 原⽂:The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the

.attr()method sometimes tookproperty values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the

.prop() method provides away to explicitly retrieve property values, while

.attr()retrieves attributes. 译 :值和属性有⼀定区别,在特定的情况下会产⽣不同的效果.在jquery 1.6版本之前当⽤,attr()获取属性的时候有时候会获取到property值,这个动作会产⽣不寻常的结果.在jquery1,6版本下,prop()能够精确的获取到值,attr() 能够获得属性值。 原⽂:For example,

selectedIndex,

tagName,

nodeName,

nodeType,

ownerDocument,

defaultChecked, and

defaultSelectedshould be retrieved and set withthe method. Prior to jQuery 1.6, these properties were retrievable with the

.attr()method, but this was not within the scope of

attr. These do not havecorresponding attributes and are only properties. 译:举例来说,selectedIndex,

tagName,

nodeName,

nodeType,

ownerDocument,

defaultChecked, and

defaultSelected 若想获得这些值,请⽤prop⽅法.在jquery1.6版本之前.这些值可以通过attr()⽅法获得,但是实际上这不是在attr()获取范围之内，这仅仅是与值property相关,与attribtes没啥关系原⽂:Concerning boolean attributes, consider a DOM element defined by the HTML markup

, and assume itis in a JavaScript variable named

elem:译：我们来考虑布尔属性值,由假设 该input元素该⽤js变量elem命名.下⾯的操作都是按照这个input表单元素来操作的。 操作⽅式 操作结果d$( elem ).prop( "checked" )ribute( "checked" )$( elem ).attr( "checked" ) (1.6)true (Boolean) Will change with checkbox state 返回结果布尔类型, 会随着checkbox状态改变会改变true (Boolean) Will change with checkbox state 返回结果布尔类型,会随着checkbox状态改变会改变"checked" (String) Initial state of the checkbox; does not change

返回结果字符串类型, 返回的是checkbox的初始化状态,并且结果不会变化"checked" (String) Initial state of the checkbox; does not change Jquery 1.6版本,返回结果字符串类型,返回的checkbox的初始化状态,并且结果不会变化"checked" (String) Will change with checkbox state$( elem ).attr( "checked" ) (1.6.1+) jquery 1.6.1 版本以上,返回结果字符窜类型,返回的是checkbox的选中状态.

$( elem ).attr( "checked" ) (pre-1.6)true (Boolean) Changed with checkbox state

jquery 1.6.1版本⼀下,返回结果字符串类型,返回的是checkbox的状态，随着checkbox转改改变会改变原⽂:According to the , the

checked attribute is a , which means the corresponding property is true if the attribute is present at all—even if, for example,the attribute has no value or is set to empty string value or even "false". This is true of all boolean attributes.译:按照w3c特殊说明,checked这个属性是⼀个布尔类型的属性,这意味着即使 这个属性只要出现---甚⾄⽐如 没有设定值或者空字符串 更甚设置为false,那么它的属性值就为true原⽂:Nevertheless, the most important concept to remember about the

checked attribute is that it does not correspond to the

checked property. Theattribute actually corresponds to the

defaultChecked property and should be used only to set theinitial value of the checkbox. The

checked attribute valuedoes not change with the state of the checkbox, while the

checkedproperty does. Therefore, the cross-browser-compatible way to determine if acheckbox is checked is to use the property:译：尽管如此,关于checked【属性】需要记住最重要的⼀点就是它和checked值并不同.这个属性实际上对应的是defaultChecked这个dom内置值.并且只是⽤于checkbox的初始化状态 这个动作中. The

checked attribute value does not change with the state of the checkbox,看这⼀句话:check属性值【通过attr()设置和获取】并不会改变checkbox的状态值.⽽checked值【通过prop()设置 和获取】却可以做到。 因此在考虑浏览器兼容性的前提下去制定checkbox选中状态的⽅式就是⽤值⽽不是属性:if ( d )if ( $( elem ).prop( "checked" ) )if ( $( elem ).is( ":checked" ) )原⽂:The same is true for other dynamic attributes, such as

selected and

value. 译:其他动态属性⽐如 selected 和value 同样适⽤.结论：说⽩了动态改变checkbox状态 1.要么适⽤js原⽣属性 . d=true; 2,适⽤Juqery操作checked值,通过prop('checked',false);来实现

2023年6月21日发(作者：)

【jquery】checkbox选中事件查了⼀下貌似⽤最新的或者版本较⾼的jquery 请⽤下⾯的代码获取是否是选中$('#checkboxId').is(':checked')或者⽤$('#checkboxId').attr('checked') =="checked" 关于这⼀条 根据jquery版本的不同会出现验证不出来的情况今天⽤到了动态调整checkbox:⾸先得知道javascript中property 和attribute的区别： 这个链接还有其他的内容 也可以学习下查了jquery API 资料如下： ⼤概翻译⼀下： 原⽂:As of jQuery 1.6, the

.attr() method returns

undefined for attributes that have not been set. To retrieve and change DOM properties such asthe

checked,

selected, or

disabled state of form elements, use the method. 译: 对于1.6版本的jquery .attr()⽅法返回的是undefined 若没有设置attributes的话.要想获得和改变类似checked selected disabled 表单状态元素,请使⽤prop()⽅法Attributes vs. Properties属性 vs 值 原⽂:The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the

.attr()method sometimes tookproperty values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the

.prop() method provides away to explicitly retrieve property values, while

.attr()retrieves attributes. 译 :值和属性有⼀定区别,在特定的情况下会产⽣不同的效果.在jquery 1.6版本之前当⽤,attr()获取属性的时候有时候会获取到property值,这个动作会产⽣不寻常的结果.在jquery1,6版本下,prop()能够精确的获取到值,attr() 能够获得属性值。 原⽂:For example,

selectedIndex,

tagName,

nodeName,

nodeType,

ownerDocument,

defaultChecked, and

defaultSelectedshould be retrieved and set withthe method. Prior to jQuery 1.6, these properties were retrievable with the

.attr()method, but this was not within the scope of

attr. These do not havecorresponding attributes and are only properties. 译:举例来说,selectedIndex,

tagName,

nodeName,

nodeType,

ownerDocument,

defaultChecked, and

defaultSelected 若想获得这些值,请⽤prop⽅法.在jquery1.6版本之前.这些值可以通过attr()⽅法获得,但是实际上这不是在attr()获取范围之内，这仅仅是与值property相关,与attribtes没啥关系原⽂:Concerning boolean attributes, consider a DOM element defined by the HTML markup

, and assume itis in a JavaScript variable named

elem:译：我们来考虑布尔属性值,由假设 该input元素该⽤js变量elem命名.下⾯的操作都是按照这个input表单元素来操作的。 操作⽅式 操作结果d$( elem ).prop( "checked" )ribute( "checked" )$( elem ).attr( "checked" ) (1.6)true (Boolean) Will change with checkbox state 返回结果布尔类型, 会随着checkbox状态改变会改变true (Boolean) Will change with checkbox state 返回结果布尔类型,会随着checkbox状态改变会改变"checked" (String) Initial state of the checkbox; does not change

返回结果字符串类型, 返回的是checkbox的初始化状态,并且结果不会变化"checked" (String) Initial state of the checkbox; does not change Jquery 1.6版本,返回结果字符串类型,返回的checkbox的初始化状态,并且结果不会变化"checked" (String) Will change with checkbox state$( elem ).attr( "checked" ) (1.6.1+) jquery 1.6.1 版本以上,返回结果字符窜类型,返回的是checkbox的选中状态.

$( elem ).attr( "checked" ) (pre-1.6)true (Boolean) Changed with checkbox state

jquery 1.6.1版本⼀下,返回结果字符串类型,返回的是checkbox的状态，随着checkbox转改改变会改变原⽂:According to the , the

checked attribute is a , which means the corresponding property is true if the attribute is present at all—even if, for example,the attribute has no value or is set to empty string value or even "false". This is true of all boolean attributes.译:按照w3c特殊说明,checked这个属性是⼀个布尔类型的属性,这意味着即使 这个属性只要出现---甚⾄⽐如 没有设定值或者空字符串 更甚设置为false,那么它的属性值就为true原⽂:Nevertheless, the most important concept to remember about the

checked attribute is that it does not correspond to the

checked property. Theattribute actually corresponds to the

defaultChecked property and should be used only to set theinitial value of the checkbox. The

checked attribute valuedoes not change with the state of the checkbox, while the

checkedproperty does. Therefore, the cross-browser-compatible way to determine if acheckbox is checked is to use the property:译：尽管如此,关于checked【属性】需要记住最重要的⼀点就是它和checked值并不同.这个属性实际上对应的是defaultChecked这个dom内置值.并且只是⽤于checkbox的初始化状态 这个动作中. The

checked attribute value does not change with the state of the checkbox,看这⼀句话:check属性值【通过attr()设置和获取】并不会改变checkbox的状态值.⽽checked值【通过prop()设置 和获取】却可以做到。 因此在考虑浏览器兼容性的前提下去制定checkbox选中状态的⽅式就是⽤值⽽不是属性:if ( d )if ( $( elem ).prop( "checked" ) )if ( $( elem ).is( ":checked" ) )原⽂:The same is true for other dynamic attributes, such as

selected and

value. 译:其他动态属性⽐如 selected 和value 同样适⽤.结论：说⽩了动态改变checkbox状态 1.要么适⽤js原⽣属性 . d=true; 2,适⽤Juqery操作checked值,通过prop('checked',false);来实现