从动态表内的div中选择按钮

Question

我需要为表内的div内的按钮添加一个click事件处理程序。我如何使用jQuery实现它。这是我的div：

<div id = 'fromServer'></div>

以下是我如何填充它：

function onSuccess(response) {
    p = response;   //p is global for debugging! 
    resultsArray = response.results;
    str = '<table id=\'mytable\'>';
    str += '<tr><td class =\'title\'>Album</td>';
    str += '<td class =\'title\'>Track Name</td>';
    str += '<td class =\'title\'> <button id =\'save\'>Save</button></td></tr>';

    for (i = 0; i < resultsArray.length; i++) {
        str += '<tr><td>' + '<img src=\'' + resultsArray[i].artworkUrl100 +'\' height=\'100\' width=\'100\''  +  '</td>';
        str += '<td class=\'albumName\'>'  + resultsArray[i].trackName.substring(0,30) + '</td>';
        str +=   '<td> <input type=\'checkbox\' class =\'checkbox\' name=\'' + i + '\'></td></tr>';
    }
    str += '</table>';
    $('#fromServer').html(str);
}

以下是它的外观：

现在我想为保存按钮添加一个click事件处理程序，我该怎么做？这是我的尝试，但它不起作用。

$('#fromServer').find("#mytable").find("#save").bind('click', saveButtonEventHandler);

//Event Handlers
function saveButtonEventHandler(evt) {
    alert("Button pressed!");
}

Answer 1

看起来内容是用ajax加载的。 你可以使用以下功能。

$(document).on("click", '#save', function(event) { 
    alert("button pressed");
});

Answer 2

由于表和保存按钮正在动态添加到DOM中，因此最好使用委托事件处理程序：

$('#fromServer').on('click', '#save', saveButtonEventHandler);