Question

嘿我试图从生成的html表中获取数据行，我向表中添加了按钮，我试图找出如何向按钮添加事件以便从该行中获取一些单元格。

我的代码似乎不起作用，我不明白为什么。

我尝试过这个jsfiddle示例，但没有运气...... jsFiddle example 这是我的代码。

使用按钮生成表格行：

function buildHtmlTable(CompanyTime) {
            $("#excelDataTable").empty();
            var columns = addAllColumnHeaders(CompanyTime);

            for (var i = 0; i < CompanyTime.length; i++) {
                var row$ = $('<tr/>');
                if (CompanyTime[i].Company == "KaladiAdmin"){

                }
                else {

                    for (var colIndex = 0; colIndex < columns.length; colIndex++) {
                        var cellValue = CompanyTime[i][columns[colIndex]];

                        if (cellValue == null) { cellValue = ""; }

                        if (cellValue == true) {

                            row$.append($('<td><input type=\'checkbox\' name=\'Check\' checked=\'yes\'></input></td>'));
                        }
                        else if (cellValue == false) {
                            row$.append($('<td><input type=\'checkbox\' name=\'Check\' ></input></td>'));
                        }
                        else {
                            row$.append($('<td/>').html(cellValue));
                        }

                    }
                }
                if (CompanyTime[i].Company == "KaladiAdmin") {

                }
                else {
                    var button = "<button class=\"editButton\" style=\"background-color: #ffa500; color: #ffffff;\" >Update</button>" + 
                        "&nbsp;&nbsp;&nbsp;" +
                        "<button id=\"brnDelete\" class=\"btn btn-default btn-sm\" style=\"background-color: #ffa500; color: #ffffff;\">Remove</button>";
                    //var button = "<button type=\"button\" class=\"close\" data-dismiss=\"modal\">&times;</button>";
                    row$.append($('<td/>').html(button));
                }

                $("#excelDataTable").append(row$);
            }
        }

按钮事件：

    $('button.editButton').click(function () {
        //var id = $(this).parent().siblings('.CID').text();

        console.log("clicked");
        //console.log(id);

    })

提前致谢！

Answer 1

在您动态添加元素时，您应该使用delegation：

$(document).on('click', 'button.editButton', function () {
  // code
});

jQuery按钮单击不触发表中生成的按钮

1 个答案: