jquery - 是否有相当于 $(document).ready 在重新加载页面的一部分后初始化？

Question

我有以下非常标准的流程:

1. 我在 $(document).ready 中初始化我的页面。这包括将事件绑定(bind)到表中的元素。
2. 然后通过 ajax 调用动态刷新表格的内容

我现在需要将事件重新绑定(bind)到表内容。有这样做的标准方法吗？即，是否存在与 $(document).ready 等效的内容，在部分页面 DOM 更新后触发？

谢谢。

Answer 1

使用 live 查看事件委托(delegate)。来自文档:

When you bind a "live" event it will bind to all current and future elements on the page (using event delegation). For example if you bound a live click to all "li" elements on the page then added another li at a later time - that click event would continue to work for the new element (this is not the case with bind which must be re-bound on all new elements).

一个例子:

$('#myTable td').live("click", function() {
    alert('hello!');
});

这将保留绑定(bind)到表格单元格的事件，即使在替换后也是如此。 live手册说:

Binds a handler to an event (like click) for all current - and future - matched element.

或者，您可以将绑定(bind)包装到一个函数中，并将其作为更新表数据的方法的回调执行，例如:

function bindStuffToTable()
{
    $('#myTable td').click(function() {
       alert('Hello!');
    });
}

$('#myTable').load('/some/link', bindStuffToTable);

或者如果整个表被动态替换，这更有可能:

$('#someButton').click(function() {
    //replaces the contents of someDiv with the table generated by foo.php
    $('#someDiv').load('foo.php', bindStuffToTable);
});