在IE11和Firefox下attr和prop的兼容性问题(IE低版本和google没有问题)

最近工作中遇到一个比较棘手的兼容性问题,下面就分享一下解决过程吧

■背景说明:

左边一个文本框,右边一个下拉框,下拉框显示从数据库取出来的数据,功能要求左边的文本框输入右边下拉框的value值,下拉框自动定位到

对应的数据,如果输入的值下拉框没有,则返回到为空的状态

■现象
使用jquery语句$(this).attr('selected',true)进行选中设置,文本框输入value值,选中下拉框对应的某个option时会出现下面两种情况:
1.只有在IE11,Firefox浏览器中第一次输入有效,当再次输入刚刚输入的value值选择当前已经选中的option时就会返回到"请选择"状态,
用Firebug查看select属性时可以看到刚刚选择的option是selected状态,但是页面显示"请选择",
2.只有在IE11,Firefox浏览器中输入选中值之后,当回过来再次选择之前选择过的值时,也会返回到"请选择"状态
■原因
相比attr,prop是1.6.1才新出来的,两者从中文意思理解,都是获取/设置属性的方法(attributes和properties)。
只是,window或document中使用.attr()方法在jQuery1.6之前不能正常运行,因为window和document中不能有attributes。
prop应运而生了。(我这边的jquery版本是1.11.1)

■原代码
$(this).attr("selected",true);
■改修案
$(this).prop("selected",true);

猜你喜欢

转载自blog.csdn.net/tancy_weipj/article/details/50633907
今日推荐