我正在使用jQuery在UpdatePanel内的元素上连接一些鼠标悬停效果。事件绑定在$(document)中。准备好了。例如:

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

当然,这在页面第一次加载时工作得很好,但是当UpdatePanel进行部分页面更新时,它不会运行,鼠标悬停效果在UpdatePanel内部也不再工作。

在第一个页面加载时,以及每次UpdatePanel触发部分页面更新时,建议使用什么方法来连接jQuery中的内容?我应该使用ASP。NET ajax生命周期代替$(document).ready?


当前回答

当美元(文档)。ready(function(){…})不工作后页面发布回来,然后使用JavaScript函数pageLoad在Asp。页面如下:

<script type="text/javascript" language="javascript">
function pageLoad() {
// Initialization code here, meant to run once. 
}
</script>

其他回答

我的回答是基于上面所有专家的评论,但下面是以下代码,任何人都可以使用它来确保在每次回发和每次异步回发时JavaScript代码仍然会被执行。

在我的例子中,我在页面中有一个用户控件。只需将下面的代码粘贴到用户控件中。

<script type="text/javascript"> 
        var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(EndRequestHandler);
    function EndRequestHandler(sender, args) {
        if (args.get_error() == undefined) {
            UPDATEPANELFUNCTION();
        }                   
    }

    function UPDATEPANELFUNCTION() {
        jQuery(document).ready(function ($) {
            /* Insert all your jQuery events and function calls */
        });
    }

    UPDATEPANELFUNCTION(); 

</script>

FWIW,我在使用mootools时也遇到了类似的问题。重新附加我的事件是正确的举动,但需要在请求结束时完成

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function() {... 

如果beginRequest导致你得到空引用JS异常,请记住这一点。

干杯

升级到jQuery 1.3并使用:

$(function() {

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

});

注:现场工作与大多数事件,但不是所有。在文档中有一个完整的列表。

函数pageLoad()在这种情况下使用非常危险。您可以将事件连接多次。我也会远离.live(),因为它附加到文档元素,并且必须遍历整个页面(又慢又糟糕)。

迄今为止我见过的最佳解决方案是在更新面板之外的包装器上使用jQuery .delegate()函数并使用冒泡。除此之外,您还可以使用Microsoft的Ajax库来连接处理程序,该库旨在与UpdatePanels一起工作。

我会使用以下方法之一:

将事件绑定封装在函数中,并在每次更新页面时运行它。您总是可以包含到特定元素的事件绑定,这样就不会将事件多次绑定到相同的元素。 使用livequery插件,它基本上自动执行方法一。根据希望对事件绑定的控制程度,您的偏好可能有所不同。