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

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

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

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


当前回答

对于布莱恩·麦凯的回答:

我通过ScriptManager将JavaScript注入到我的页面中,而不是直接将它放入UserControl的HTML中。在我的例子中,我需要滚动到UpdatePanel完成并返回后可见的表单。这在文件后面的代码中。在我的示例中,我已经在主内容页上创建了prm变量。

private void ShowForm(bool pShowForm) {
    //other code here...
    if (pShowForm) {
        FocusOnControl(GetFocusOnFormScript(yourControl.ClientID), yourControl.ClientID);
    }
}

private void FocusOnControl(string pScript, string pControlId) {
    ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "focusControl_" + pControlId, pScript, true);
}

/// <summary>
/// Scrolls to the form that is made visible
/// </summary>
/// <param name="pControlId">The ClientID of the control to focus on after the form is made visible</param>
/// <returns></returns>
private string GetFocusOnFormScript(string pControlId) {
    string script = @"
    function FocusOnForm() {
        var scrollToForm = $('#" + pControlId + @"').offset().top;
        $('html, body').animate({ 
            scrollTop: scrollToForm}, 
            'slow'
        );
        /* This removes the event from the PageRequestManager immediately after the desired functionality is completed so that multiple events are not added */
        prm.remove_endRequest(ScrollFocusToFormCaller);
    }
    prm.add_endRequest(ScrollFocusToFormCaller);
    function ScrollFocusToFormCaller(sender, args) {
        if (args.get_error() == undefined) {
            FocusOnForm();
        }
    }";
    return script;
}

其他回答

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

<script type="text/javascript" language="javascript">
function pageLoad() {
// Initialization code here, meant to run once. 
}
</script>
Sys.Application.add_load(LoadHandler); //This load handler solved update panel did not bind control after partial postback
function LoadHandler() {
        $(document).ready(function () {
        //rebind any events here for controls under update panel
        });
}

我的答案吗?

function pageLoad() {

  $(document).ready(function(){

etc.

在许多其他解决方案都惨败的情况下,它就像一个魅力。

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

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

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

干杯

对于布莱恩·麦凯的回答:

我通过ScriptManager将JavaScript注入到我的页面中,而不是直接将它放入UserControl的HTML中。在我的例子中,我需要滚动到UpdatePanel完成并返回后可见的表单。这在文件后面的代码中。在我的示例中,我已经在主内容页上创建了prm变量。

private void ShowForm(bool pShowForm) {
    //other code here...
    if (pShowForm) {
        FocusOnControl(GetFocusOnFormScript(yourControl.ClientID), yourControl.ClientID);
    }
}

private void FocusOnControl(string pScript, string pControlId) {
    ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "focusControl_" + pControlId, pScript, true);
}

/// <summary>
/// Scrolls to the form that is made visible
/// </summary>
/// <param name="pControlId">The ClientID of the control to focus on after the form is made visible</param>
/// <returns></returns>
private string GetFocusOnFormScript(string pControlId) {
    string script = @"
    function FocusOnForm() {
        var scrollToForm = $('#" + pControlId + @"').offset().top;
        $('html, body').animate({ 
            scrollTop: scrollToForm}, 
            'slow'
        );
        /* This removes the event from the PageRequestManager immediately after the desired functionality is completed so that multiple events are not added */
        prm.remove_endRequest(ScrollFocusToFormCaller);
    }
    prm.add_endRequest(ScrollFocusToFormCaller);
    function ScrollFocusToFormCaller(sender, args) {
        if (args.get_error() == undefined) {
            FocusOnForm();
        }
    }";
    return script;
}