1

当通过 Firefox 运行以下代码并单击 X 按钮时，javascript 将 tmpField 作为未定义返回。我需要获取按钮的父节点，即 div。

<head>
    <title></title>
    <script type ="text/javascript">
        function RemoveItem() {
                if (document.addEventListener) {
                    var container = document.getElementById("InputContainer");
                    var tmpField = this.parentNode;
                    alert("Field: " + tmpField);                 
                }
        }
    </script>
</head>
<body>
<table width="100%">
<tr>
    <td style="width: 10%; vertical-align:top;">Field:</td>
    <td id="InputContainer">
        <div id="divInput1" style="display: inline;">
            <input id="txtComment1" name="txtComment" type="text" maxlength="35" />
            <input id="btnDelete1" value="X" type="button" name="btnDelete" onclick="RemoveItem()" />
        </div>
    </td>
</tr>
</table>
</body>
</html>

在我的场景中，我在“InputContainer”中动态创建多个 div。这些 div 中的每一个都具有相同的结构，包含一个文本框和删除按钮（ID 包含下一个增量）。能够返回按钮的 parentNode 对我来说很重要，该按钮始终是 div。我有它的代码可以在 IE 中工作，但不能在 Firefox 中工作。任何想法如何解决？

谢谢...

4

1 回答 1

1

使用这个 HTML：

<input id="btnDelete1" value="X" type="button" name="btnDelete" onclick="RemoveItem(this)" />

而这个JS：

function RemoveItem(button) {
    var container = document.getElementById("InputContainer");
    var tmpField = button.parentNode;
    alert("Field: " + tmpField);
}

演示：http: //jsfiddle.net/jwpds/1/

RemoveItem函数调用的上下文是全局的，所以this指的是window. 要获取点击的特定元素，您需要传入this函数调用，然后将其作为函数中的参数访问。

而且我不知道您为什么要检查document.addEventListener，但我可以向您保证，您所做的事情并不需要它。

于 2013-04-08T21:09:56.230 回答