jQuery的$（文件）。就绪和UpdatePanel的？ [英] jQuery $(document).ready and UpdatePanels?

问题描述

我使用jQuery要连接上是一个UpdatePanel内的元素一些鼠标悬停效果。这些事件必将在 $（文件）。就绪。例如：

I'm using jQuery to wire up some mouseover effects on elements that are inside an UpdatePanel. The events are bound in $(document).ready . For example:

$(function() {    
    $('div._Foo').bind("mouseover", function(e) {
        // Do something exciting
    });    
});

当然，这工作正常第一次加载页面时，但是当在UpdatePanel做局部页面更新，它无法运行，鼠标悬停效果不工作了的UpdatePanel内。

Of course, this works fine the first time the page is loaded, but when the UpdatePanel does a partial page update, it's not run and the mouseover effects don't work any more inside the UpdatePanel.

什么是布线的东西推荐的方法了jQuery中不仅在第一个页面加载，但每一个UpdatePanel触发部分页面的更新时间？我应该使用ASP.NET AJAX的生命周期，而不是​​ $（文件）。就绪？

What's the recommended approach for wiring stuff up in jQuery not only on the first page load, but every time an UpdatePanel fires a partial page update? Should I be using the ASP.NET ajax lifecycle instead of $(document).ready?

推荐答案

一个UpdatePanel完全取代上一个更新的更新面板的内容。这意味着，不再订阅那些你订阅的事件，因为有在更新面板新的元素。

An UpdatePanel completely replaces the contents of the update panel on an update. This means that those events you subscribed to are no longer subscribed because there are new elements in that update panel.

我所做的工作围绕这是重新订阅我每次更新后需要的事件。我使用 $（文件）。就绪（）初始负载，则使用微软的PageRequestManager（仅当你有你的页面上的更新面板）重新订阅每一次更新。

What I've done to work around this is re-subscribe to the events I need after every update. I use $(document).ready() for the initial load, then use Microsoft's PageRequestManager (available if you have an update panel on your page) to re-subscribe every update.

$(document).ready(function() {
    // bind your jQuery events here initially
});

var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_endRequest(function() {
    // re-bind your jQuery events here
});

的 PageRequestManager 是一个JavaScript对象，它是自动可用如果更新面板在页面上。你不应该需要做比code以外的任何其他的上方，以便只要在UpdatePanel在页面上使用它。

The PageRequestManager is a javascript object which is automatically available if an update panel is on the page. You shouldn't need to do anything other than the code above in order to use it as long as the UpdatePanel is on the page.

如果您需要更详细的控制，这一事件传递的参数类似事件如何.NET传递参数（发件人，EventArgs），所以你可以看到什么引发的事件和只有重新绑定如果需要的话。

If you need more detailed control, this event passes arguments similar to how .NET events are passed arguments (sender, eventArgs) so you can see what raised the event and only re-bind if needed.

下面是微软文档的最新版本：<一href=\"http://msdn.microsoft.com/en-us/library/bb383810.aspx\">msdn.microsoft.com/.../bb383810.aspx

Here is the latest version of the documentation from Microsoft: msdn.microsoft.com/.../bb383810.aspx

有一个更好的选择，你可能有，根据您的需要，是使用jQuery的 。对（） 。这些方法比重新订阅每个更新DOM元素更加高效。阅读所有的文档使用此方法之前，但是，因为它可能会或可能不会满足您的需求。有很多jQuery插件，这将是不合理的重构使用 .delegate（）或。对（） ，所以在这种情况下，你最好重新订阅。

A better option you may have, depending on your needs, is to use jQuery's .on(). These method are more efficient than re-subscribing to DOM elements on every update. Read all of the documentation before you use this approach however, since it may or may not meet your needs. There are a lot of jQuery plugins that would be unreasonable to refactor to use .delegate() or .on(), so in those cases, you're better off re-subscribing.

这篇关于jQuery的$（文件）。就绪和UpdatePanel的？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！