javascript: IE 中的 getElementById 问题
我正在尝试使用 JavaScript 将单击事件附加到复选框。下面显示的是 HTML 和 JS。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<input type="hidden" name="caution_c" value="0">
<input type="checkbox" id="caution_c" name="caution_c" value="1" tabindex="120">
<script type="text/javascript">
var cb = document.getElementById('caution_c');
cb.onclick = function() {
alert(1);
}
</script>
</body>
</html>
问题是在 IE 中,单击事件不会触发。我已经缩小了问题所在的范围。问题是复选框之前有一个隐藏的输入,并且这两个元素具有相同的名称。我不确定为什么这会导致问题(毕竟,我使用的是 getElementById 并且隐藏元素甚至没有 id)。
这种类型的行为是否有正当理由(仅限 IE。在 Firefox 中工作正常...一如既往:( )?另外,是否有一个好的解决方法(我可以做 document.getElementsByName('caution_c') [1]但我不想...)
I am trying to attach a click event to a check box using JavaScript. Shown below is the HTML and JS.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<input type="hidden" name="caution_c" value="0">
<input type="checkbox" id="caution_c" name="caution_c" value="1" tabindex="120">
<script type="text/javascript">
var cb = document.getElementById('caution_c');
cb.onclick = function() {
alert(1);
}
</script>
</body>
</html>
The problem is that in IE, the click event does not fire. I have narrowed down the problem location. The issue is that there is a hidden input just before the check box and both these elements have the same name. I'm not sure why this is causing a problem(after all, I'm using getElementById and the hidden element does not even have an id).
Is there a valid reason for this type of behavior (IE only. Works fine in Firefox...as always :( )? Also, is there a good workaround (I could just do document.getElementsByName('caution_c')[1] but I don't want to...)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
Internet Explorer 对
name
和id
感到困惑 - 强烈建议将这两个属性视为相同。您可以通过 1) 确保文档中没有 ID/名称冲突,或 2) 覆盖 IE 的本机 getElementById 方法。
在此处了解更多信息。
Internet Explorer gets confused over
name
andid
- it is highly recommended to treat these two attributes as if they were the same.You can fix it either by 1) ensure that there are no id/name conflicts in your document, or 2) override IE's native getElementById-method.
Read more about it here.
尝试使用不同的事件,例如
onchange
或onfocus
看看是否可以解决问题。另外,我认为如果用户点击复选框,onclick
不会被触发,这可能是也可能不是您想要的工作方式。Try using a different event such as
onchange
oronfocus
to see if that solves it. Also I don't thinkonclick
will be fired if a user tabs onto the checkbox, which may or not be how you intend it to work.我同意,IE 在理解 html 级别的事物方面很差。
我宁愿将链接添加到按钮而不是使用锚元素,因为 IE 在锚点级别使用
document.getElementById()
时遇到问题。在按钮上尝试相同的操作,并且适用于其他用户。I agree, IE is poor in understanding things at html level.
I would rather add the link to button rather than using anchor elements, as IE is having trouble at anchor level with
document.getElementById()
. Try same at button and will work for other users.