如何让 IE 的 Javascript 实现“this”关键字功能？答案

【问题标题】：How can I get IE's Javascript to implement the 'this' keyword functionality?如何让 IE 的 Javascript 实现“this”关键字功能？
【发布时间】：2010-04-11 19:51:09
【问题描述】：

Internet Explorer 是否有解决方法来实现 'this' javascript 关键字提供的功能以获取触发事件的 dom 元素？

我的问题场景是：我在 html 表单中有可变数量的文本字段，例如

<input type="text" id="11"/>  
<input type="text" id="12"/>

我需要为每个文本字段处理“onchange”事件，并且处理取决于触发事件的字段的“id”。到目前为止，我知道我的选择是： 1) 为每个文本字段附加一个专用的事件处理程序。所以如果我有 n 个字段，我就有 n 个不同的功能，例如：

<input type="text" id="11" onchange="function11();"/>  
<input type="text" id="12" onchange="function12();"/>

但文本字段是动态添加和删除的，因此更好的方法是使用一个通用函数。

2) 使用 'this' 关键字，例如：

<input type="text" id="11" onchange="functionGeneric(this);"/>  
<input type="text" id="12" onchange="functionGeneric(this);"/>

但此选项不适用于 Internet Explorer。

任何人都可以建议一种解决方法以使其在 IE 或其他可以在此处应用的解决方案中工作吗？谢谢。

【问题讨论】：

快速提示：以数字开头的元素 ID 是非法的。它们只能以字母或下划线开头。相应地修复以避免无情的浏览器造成无法解释的行为。至于您的问题：请更新您的问题以包含sscce.org，这应该可行。

标签： javascript jquery html event-handling this

【解决方案1】：

我无法重现您的问题。下面是根据 cmets 最新信息的SSCCE：

<!doctype html>
<html lang="en">
    <head>
        <title>SO question 2618458</title>
        <script>
            function functionGeneric(id) {
                alert(id); // Shows either 11 or 12 correctly.
            }
        </script>
    </head>
    <body>
        <input type="text" id="text_11" onchange="functionGeneric(this.id.split('_')[1]);"/>  
        <input type="text" id="text_12" onchange="functionGeneric(this.id.split('_')[1]);"/>
    </body>
</html>

它在我这里的所有主要浏览器中都能正常工作。您的实际问题出在其他地方。在您想出更多细节或更好的 SSCCE 之前，它是在黑暗中寻找根本原因。

【讨论】：

【解决方案2】：

第二个选项可能不起作用，因为元素 ID 必须以字母或下划线字符开头（至少，根据规范）。

我会选择这样的：

// make the ids start with a word, like "foo", followed by "_", followed by a number
$("input[id^='foo_']").change(function() {
    doSomething(this.id.split("_")[1]); // extract the number, pass to function
});

这会将更改处理程序附加到 ID 为 starting with 'foo' 的所有输入，并将 ID 从 ID 中拆分出来以传递给处理该数字的通用函数。

【讨论】：

打败我。 Firefox 似乎可以容忍以数字开头的 ID，但 IE 坚持这一规范（仅此一次）。
我做了一个小测试，它确实在 IE 中工作。因此，这并不能解释他遇到的实际问题。
@BalusC - 他说“并且处理取决于触发事件的字段的'id'。”所以，他可能会尝试在他的genericfunction() 中使用 ID，这会导致 IE 阻塞。
谢谢卡里姆。我不知道 ID 规范。但 BalusC 是对的。问题不在于 ID。我实际上将 id 设置为 'text_11' 和 'text_12'。所以真正的问题是获取触发事件的dom元素
函数：doSomething(this.id.split("_")[1]);由于“this”关键字，无法在 IE 中使用。