将click事件分配给动态添加的按钮

Question

我正在动态创建一些按钮并为它们分配ID.

当有人点击该按钮时我想收集ID并从那里执行一些任务.

这是我正在进行的工作

$(document).ready(function() {
    $('input:button').addClass("btnClass");
    fillData();
    $('#btnGet').click(function() {
        fillData();
    });
    function fillData() {
        $.ajax({
            type: "Post",
            url: "../Linq/myService.asmx/getStudent",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                //var nMsg = (typeof msg.d) == 'string' ? eval('(' + msg.d + ')') : msg.d;
                var t = "<table width='80%' id='resTab'> <tr>" +
                      "<td colspan='5' style='text-align:center'><font size='3'><strong>Your Search Result......</strong></font></td></tr> <tr><td style='text-align:left' colspan='5'><hr></td></tr> "
                      + " <tr><td style='text-align:center'>Student ID</td><td style='text-align:center'>Student Name</td><td style='text-align:center'>Student Course</td><td style='text-align:center'>Student USN</td></tr>"
                      + " <tr><td style='text-align:left' colspan='5'><hr><br></td></tr> ";
                $.each(msg.d, function(index, item) {
                    t = t + " <tr><td style='text-align:center'>" + item.studId + "</td><td style='text-align:center'>" + item.studName + "</td><td style='text-align:center'>" + item.studCourse + "</td><td style='text-align:center'>" + item.studUsn + "</td><td><input type='button' ID='btn" + item.studId + "' value='Delete' onClick='onButtonClick()'/></td></tr>";
                    t = t + " <tr><td style='text-align:left' colspan='5'><hr></td></tr> ";
                });
                t = t + " </table> ";
                $("#stdData").html(t);
            },
            error: function(msg) { }
        });
    }


function onButtonClick() {
    var btnId = $(this).val();
    alert(btnId);
}

Answer 1

只需new-button为您正在创建的按钮添加一个类名,然后添加一个单击处理程序.

所以替换这段代码

<input type='button' ID='btn"

有了这个

<input type='button' class="new-button" ID='btn"

您可以从onclick事件中删除onButtonClick()并替换

function onButtonClick() {
    var btnId = $(this).val();
    alert(btnId);
}

同

$(".new-button").live("click", function() {
    var buttonId = $(this).attr("id");
    alert(buttonId);
});