javascript: IE 中的 getElementById 问题

发布于 2024-09-18 22:13:41 字数 1003 浏览 7 评论 0原文

我正在尝试使用 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

自此以后,行同陌路 2024-09-25 22:13:41

Internet Explorer 对 nameid 感到困惑 - 强烈建议将这两个属性视为相同。

您可以通过 1) 确保文档中没有 ID/名称冲突,或 2) 覆盖 IE 的本机 getElementById 方法

在此处了解更多信息

Internet Explorer gets confused over name and id - 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.

童话 2024-09-25 22:13:41

尝试使用不同的事件,例如 onchangeonfocus 看看是否可以解决问题。另外,我认为如果用户点击复选框,onclick 不会被触发,这可能是也可能不是您想要的工作方式。

Try using a different event such as onchange or onfocus to see if that solves it. Also I don't think onclick will be fired if a user tabs onto the checkbox, which may or not be how you intend it to work.

寂寞陪衬 2024-09-25 22:13:41

我同意,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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文