jquery - 如何使用 jquery 在引导弹出窗口中委托（） HTML 元素

Question

我正在尝试通过单击编辑按钮来启用、禁用控件，但我无法使用 jQuery 委托函数访问它。这里是代码：

$('#table-view-task').delegate('tr:not(:first)','click', function(){
    var id = $(this).find('td:first').text();
    var task = $(this).find('td:eq(1)').text();
    $(this).popover({
        html: true,
        delay: { show: 0, hide: 0 },
        title: function () {
                return '<div>'+task+'</div>';
        },
        content: function () {
                return  '<div id="pop-container">'+
                        '<label>ID</label>'+
                        '<input type="text" value="'+id+'" id="txt-edit-id" disabled/>'+
                        '<label>Task</label>'+
                        '<input type="text" value="'+task+'" id="txt-edit-task" disabled/>'+
                        '<a href="#" class="btn" id="btn-edit-task">Edit</a>'+
                        '<a href="#" class="btn" id="btn-save-task">Save</a>'+
                        '</div>';
        }
    });  
});

这将使用所有 html 元素正确打印弹出框。如何使用 jquery 访问这些元素。那么如何访问编辑链接。这是我尝试这样做的方法：

$('#pop-container').delegate('a','click', function(){
    alert('editing');
});

Answer 1

您需要取消链接 [EDIT: 的默认操作并收听body而不是#pop-container]。尝试

$('body').delegate('#btn-edit-task, #btn-save-task','click', function(e){
    e.preventDefault();
    alert('editing');
});

如果您不取消链接的默认操作，它们只会将您带到由其href属性指定的 URL。

请注意，由于.delegate()已被.on()jQuery 1.7 及更高版本的方法所取代，这样做会更好：

$('body').on('click', '#btn-edit-task, #btn-save-task', function(e) {
    e.preventDefault();
    alert('editing');
});