jquery 需要在部分页面回发时重新绑定事件答案

【问题标题】：jquery needs to rebind events on partial page postbackjquery 需要在部分页面回发时重新绑定事件
【发布时间】：2010-10-20 03:17:36
【问题描述】：

当我执行部分页面回发时，如何重新绑定我的事件 (jquery)？

我正在使用以下方式连接所有内容：

$(document).ready(function(){};

在部分页面回发后，我的事件没有触发。

【问题讨论】：

【解决方案1】：

您可以点击PageRequestManager endRequestEvent：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(){});

或者，如果您尝试附加控制事件，您可以使用 jQuery live events。

另一种选择是手动进行事件委托。这就是“现场”活动在幕后所做的事情。将事件处理程序附加到文档本身，然后如果事件的发送者是您期望的元素，则有条件地执行您的方法。

$(document).click(function(e){  
    if($(e.target).is(".collapseButton")){  
        $(this).find(".collapsePanel").slideToggle(500);  
    }  
})

【讨论】：

谢谢它的工作，猜它不是那么有效，但它只适用于这一页。
其实效率很高。如果您在网格的每一行都有事件处理程序，那么整个网格将只有一个事件处理程序。如果每一行都有多个事件处理程序，它会变得更好。您可以只使用一个....而无需附加到手动或通过部分回发创建的新记录。

【解决方案2】：

我从“部分页面回发”猜测您在 Asp.net 领域工作。

尝试使用

Sys.Application.add_load(function() { });

您应该仍然可以在该函数中使用所有正常的 jQuery 内容。

【讨论】：

没错。这正是 MS 发明加载事件的原因：他们知道在部分回发后他们会吹走 DOM 元素，并且他们需要在页面准备好时为开发人员提供一种处理方式，无论是否使用花哨的 AJAX UpdatePanel 或不是。
完美。这成功了。只是直接并通过此事件调用了我相同的设置方法，它现在可以完美运行。干杯！

【解决方案3】：

查看 jQuery 1.3 here 的“实时”功能。您可以将事件添加到未来元素以及页面上的当前元素。这可能会简化您需要编写的代码。

【讨论】：

【解决方案4】：

最优雅的解决方案（使用 jQuery 2.x）是这样的：

使用“on”事件。确保将事件绑定到文档而不是元素本身！

代码示例：

$(document).on('click', 'div.messages', function () {
    console.log('click on div.messages');
    return false;
});

例如，将此代码放入 document.ready 中。

即使在 UpdatePanel 中更改或创建了 div.messages，这仍然有效。而且它永远不会一次发射两次或更多次。

【讨论】：

【解决方案5】：

当您执行部分回发时，一些 DOM 元素会被替换，当然，新元素会丢失 jQuery 绑定。您可以使用 ScriptManager 类来注册将在部分回发完成后执行的脚本（看看here）

【讨论】：