Question

我的HTML：

<table id="laboral">
    <tr>
        <td><input type="text" name="start"/></td>
        <td><input type="text" name="end"/></td>
        <td><textarea name="desc"></textarea></td>
        <td><button type="button" onclick="saveRow(this);"> + </button></td>
    </tr>
</table>

当我按下+按钮时，我会像第一个一样创建一个新行，但onclick事件不起作用：

以下是保存值并创建2 input和textarea的代码：

var button = document.createElement("button");
button.type = "button";
button.setAttribute("onclick", "saveRow(this);")
button.innerHTML = "+";
var btn = tr.insertCell(3);
btn.appendChild(button);

如果我用Firefox检查结果，我可以看到第一个按钮和新生成的代码具有相同的代码。但生成的不起作用。

Answer 1

不是为您可能添加的所有按钮定义事件处理程序，而是将其推迟到表中可能更有效。在这种情况下，你会这样做：

// this script should be placed after the table on the page, or deferred in some way
document.getElementById('laboral').onclick = function(e) {
    e = e || window.event;
    var elem = e.srcElement || e.target;
    if( !elem.tagName) elem = elem.parentNode;
    if( elem.tagName == "BUTTON") {
        var tr = elem;
        // find the row that contains the button
        while(tr.tagName != "TR") tr = tr.parentNode;
        tr.parentNode.insertBefore(tr.cloneNode(true),tr.nextSibling);
    }
};

完成^ _ ^

创建新的HTML元素时，Javascript函数不起作用

1 个答案: