|
问题描述：
如下图，做了一个员式列表，然后点击编辑的时候，可以对于员工信息进行编辑。在编辑前，首先要做的就是绑定当前的数据，其中，如果员工为男性别就选中男，如下当前员工为女就选中女. 图片：1.png  图片：2.png
代码实现如下： 使用了jquery中的attr 的方法， dom 原生的setAttributer的方法都不行。在反复切换的过程中，不能够正确的选中，第一次的选中还是可以的。可是多几次切换就不正确的。 if(sex=="男"){ // $("#sexM").attr("checked",true); // $("#sex).removeAttr("checked"); //$("#sexW").attr("checked",false); $("#sexM")[0].setAttribute('checked',true); $("#sexW")[0].setAttribute('checked',false); //jquery attr } else { $("#sexW")[0].setAttribute('checked',true); $("#sexM")[0].setAttribute('checked',false); // $("#sexW").attr("checked",true); // $("#sexM").removeAttr("checked"); // $("input[type='sexRadio']").eq(1).attr("checked","checked"); // $("input[type='sexRadio']").eq(0).attr("checked",false); } 但是，通过下面的方法，却可以正确的实现 if(sex=="男"){ $("#sexW")[0].checked=false; $("#sexM")[0].checked=true; } else { $("#sexM")[0].checked=false; $("#sexW")[0].checked=true; } 在使用以上的方法时，就可以正确的实现. 为什么呢？ 是jquery 的问题嘛，可以第一种方式里，我们也用了DOM中提供的方法： $("#sexW")[0].setAttribute('checked',true); $("#sexM")[0].setAttribute('checked',false); 发现，即使是原生的方法通过setAttribute，也是有问题了。 最后，经过查询发现了attribute vs property 的区别.
setAttribute 是用来设置attribute的. $("#sexM")[0].checked 的这种方式是用来设置property的. 那checked到底是attribute属性还是property属性呢？ 如下图，我们可以看出checked属性attribute属性，但是,我们在操作时，会把它变成peoperty属性来操作。 图片：6.png
所以，在使用jquery 来操作property属性时，在jquery1.6+ 以上的版本，jquery专门提供了一个方法.prop来进行property属性的设置。 经测试，使用以下的代码，也可以完美的解决上面的问题。 if(sex=="男"){ //$("#sexW").prop("checked",false); //$("#sexM").prop("checked",true); } else { // $("#sexM").prop('checked'); // $("#sexW").attr("checked",true); } 可参考如下图的官方说明： 图片：4.png
|
|
|
公众号
