javascript - 为什么按钮的 onclick 属性不起作用？

Question

var tbody = $("#queryModalTable tbody");
list_of_tasks.forEach(function (t) {

tbody.append(
 $(document.createElement("tr")).append(
        $(document.createElement("td")).text(t.task_id),
        $(document.createElement("td")).text(t.task_status),
        $(document.createElement("td")).text(t.task_operator),
        $(document.createElement("td")).text(t.number_of_hits),
        $(document.createElement("td")).text(t.finished_hits),
        $(document.createElement("td")).append(
           $(document.createElement("button"))
                .addClass("btn btn-primary")
                .attr("type", "button")
                .attr("onclick","showTaskResult(t)")
                .attr("data-toggle", "collapse")
                .attr("data-target", "#collapseExample")
                .attr("aria-expanded", "false")
                .attr("aria-controls", "collapseExample")
                .text("show task results")
              )
           )
      );

});

只是想知道为什么showTaskResult(t)函数无法触发，onclick和“data-toggle”、“collapse”之间是否有冲突？

Answer 1

由于您将 onclick 添加为字符串属性，因此不会在当前上下文中对其进行求值，因此 t 变量在触发时不在作用域内。

解决方案是像这样分配点击处理程序:

$(document.createElement("button"))
    .addClass("btn btn-primary")
    ...
    ...
    ...
    .click(function(){
        showTaskResult(t);    
    })