jQuery设置checked标签后但是不显示勾选

这是一个很小的问题,却能困扰一个人很久。

当使用jQuery的attr(attr,value)给<input type='checkbox'/>赋值checked时,查看代码已经复制了,但是页面上却不显示勾选。

具体解决方法如下:

使用prop()方法即可。

原因如下:

在高版本的jquery中,引入了prop方法

两者的使用区别如下:

  • 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
  • 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。

也就是说,一般情况下使用attr方法是告诉jquery给一个dom的attributes属性增加一个attributes(key:value)。
而prop的意思就是让这个dom的原生属性做出改变,也就是说浏览器会重新解析原生属性,从而影响了dom在页面上的显示。

可以这么来看这个dom

1
2
3
4
5
dom:
checked:false
disabled:false
attributes:[]
...

浏览器会对原生属性做解析,而不会对attributes里的属性做解析,就是这么简单。