Question

我试图将处理程序添加到JQuery中生成的tr中，但它没有响应。每行的意思是打开一个不同的视图。

someArray.forEach(
    function (element) {           
       $('#table').append("<tr id='" + element.id +"'</tr>").ready(
          function() {
            $("#" + class.id).on("click", function () {
                $("body").load("OtherView.html");                   
            })
    });     
 });

Answer 1

这就是我要做的。使用on进行动态绑定，并使用数据属性保存新目标。像这样：

var someArray = [{id:1, target:"View.html"},{id:2, target:"OtherView.html"},{id:3, target:"SomeOtherView.html"}]

//Dynamically bind the click event
$("#table").on("click", "tr", function(){
  //Add your logic here
  console.log($(this).data("target"));
});

//Populate the table
someArray.forEach(function (element) {           
       $('#table').append(`<tr id='${element.id}' data-target='${element.target}'><td>${element.target}</td></tr>`);     
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="table"></table>

一些建议阅读：

理想情况下，我会用document fragment更新表格减少DOM更新的数量，但是我不想做太多更改。

如何在JQuery中为动态创建的tr添加处理程序？

1 个答案: