您的位置:首页 > 其它

IE8、IE7、IE6中使用getElementById需要注意的问题

2013-10-08 21:23 411 查看
最近,在公司负责编写一个绩效考核模块,页面上有许多输入框,笔者就想用javascript做一下简单验证,用struts的验证比较麻烦而且增加服务器负载。笔者在公司电脑上安装了IE10、chrome、firefox、搜狗浏览器这几个比较主流的浏览器进行测试,没有发现什么问题,但是提交代码后,别人在IE8上测试出现了各种各样的问题。。。笔者表示十分郁闷!!下面是笔者写的部分js代码和html页面代码:

<html>
<head>
<script>
function check(obj)
{
var div=document.getElementById(obj.name);
if(obj.value=='')
div.innerHTML="输入不正确!";
}
</script>
</head>
<body>
<input type="text" onblur="check(this);" name="common.serveArea"/>
<div id="common.serveArea" style="color:red;display:inline"></div>
</body>
</html>


上面是一部分代码,不是源代码。。。。笔者这里设计让div来显示错误提示,div的id属性与input的name属性相同,这样使用onblur事件,当鼠标离开文本框时,调用check方法,check方法传入的是input标签做参数,通过访问input标签的name属性,获得div的id属性,再通过getElementById获得div标签,控制div标签里面的内容。。。

可是,在IE8上发现,div标签内的内容并没有任何变化,倒是input标签的显示来回变化。。。。

笔者觉得这完全是IE8上使用getElementById这个方法时,没有获得div标签,在通过f12开发者工具进行调试后,发现果然是这样。笔者在网上查了一下getElementById在ie8中使用时注意的问题,发现了这个解释http://www.w3help.org/zh-cn/causes/SD9001

这里提到,同时需注意页面中的元素的 id 属性值不能与其他元素的 name 属性值有重复。

也就是说,假如页面中有个input标签的name属性和某个标签的id属性相同,那么你通过getElementById获得的可能是那个input标签
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: