设置input checked 失效 解决方案

小编在写代码的过程中用到了input标签,然而小编简单的以为使用老套的jquery的attr()即可,没想到入了一个大坑,审查匀速时即使看到 <input type ='radio' checked='checked'/> 依然没有起到选中的效果,小编就疯狂百度了一下,学习到了jQuery 1.6新增函数

主要就是将  attr()  换成prop 即可 

prop()函数

下面就来讲解一下 jQuery 1.6之前的attr() 和 jQuery 1.6新增,prop()函数

jQuery 1.6之前,attr()承担了attribute(属性)的设置和获取工作+property的设置和获取工作;

attr() 方法设置或返回被选元素的属性值。

prop() 方法设置或返回被选元素的属性和值。当该方法用于返回属性值时,则返回第一个匹配元素的值。

jQuery 1.6新增,prop()函数,并用来承担property的设置或获取工作之后,attr()才只用来负责attribute的设置和获取工作

1.6版本以后通过attr()设置checked的属性:

如果当前input中初始化未定义checked属性,则不管当前是否选中$('input[type="radio"]').attr("checked")都会返回undefined;

如果当前input中初始化已定义checked属性,则不管是否选中,$('input[type="radio"]').attr("checked")都会返回checked. 

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

$("input[type='radio']").prop("checked",true);
 

在1.6之前,你只能使用attr()函数;1.6及以后版本,你可以根据实际需要选择对应的函数。

在jQuery 1.6及以后版本中,具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop();对于其它能够用prop()实现的操作,也尽量使用prop()函数。

延伸:attr与prop

attr()

1.attr()是通过使用的 DOM 的 API setAttribute() 和 getAttribute() 方法操作的属性元素节点

2.(一般)设置或获取自定义的DOM属性

3.用attr来设置属性名,html结构是会发生变化

4.设置的属性值只能是字符串类型(如果不是字符串类型,也会调用其toString()方法,将其转为字符串类型)5.

 prop()

1. prop()通过document.getElementById(el)[name] = value来设置的,是转化为js对象element 的一个属性

2.(一般)设置或获取元素本身就带有的固有属性(比如<a>元素的DOM属性有“href、target和class")

3.用prop来设置属性名,html结构是不会发生变

4.设置的属性值可以为包括数组和对象在内的任意类型

猜你喜欢

转载自blog.csdn.net/zlzbt/article/details/94654406