javascript - 在方法中添加 HTML Javascript 事件处理

Question

var p=0;
function addLine() {
    var tb = document.getElementById("tb");
    var row = document.createElement("TR");
    var td1 = document.createElement("TD");
    var td2 = document.createElement("TD");
    var td3 = document.createElement("TD");
    var textF = document.createElement("INPUT");
    textF.value = "Add image URL";
    td1.appendChild(textF);
    var bt = document.createElement("BUTTON");
    bt.id = p;
    p++;
    var text = document.createTextNode("Load Image");
    td2.appendChild(bt);
    bt.appendChild(text);
    var img = document.createElement("IMG");
    img.alt = "No image loaded yet";
    td3.appendChild(img);
    row.appendChild(td1);
    row.appendChild(td2);
    row.appendChild(td3);
    tb.appendChild(row);
    row.children[1].children[0].onClick = load();
}

function load() {
        console.log("in method");
        //var bt = window.event.target;
        var i = 0;
        var tb = document.getElementById("tb");
        tb.rows[i].cells[2].children[0].alt = "Image not found";
        tb.rows[i].cells[2].children[0].src = tb.rows[i].cells[0].children[0].value;
}

我想为生成的每个按钮添加一个事件处理程序，我也尝试使用addEventListener()，但似乎没有任何效果。由于某种原因，当激活 addLine() 方法时，我在“方法中”得到控制台输出。我还想要由事件创建的事件对象来获取目标。

Answer 1

问题是事件区分大小写，因此需要全部小写。您正在调用该函数并将其返回的内容分配给事件监听器。

所以你需要将其全部小写并删除 ()

row.children[1].children[0].onclick = load;

或

bt.addEventistener("click", load);