jquery effect highlight not working in asp.net update panel

问题

i have two update panels as follows (when linkbutton is clicked i'm trying to highlight div)

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>     
              <asp:Linkbutton id="btnChange" runat="server" OnCommand="LinkButton_Command"/>
              <asp:Linkbutton id="btnChange2" runat="server" OnCommand="LinkButton_Command"/>
        </ContentTemplate>        
</asp:UpdatePanel> 

<asp:UpdatePanel ID="UpdatePanel2" runat="server">
        <ContentTemplate>    
             <div id="shdr">Hello there!</div> 
        </ContentTemplate>        
</asp:UpdatePanel>

I'm overriding OnLoadComplete and registering this script on page as follows

ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "divHigh", "$('#shdr').effect('highlight', {}, 3000);", True)

This highlights the div after postback but the timeout value doesn't work it continues to show highlighted color and doesn't change back.

What can be causing this not to work?

回答1:

If you're using an UpdatePanel - i.e. a Script Manager

$(function () {
 //Code that runs before update panel is fired.

        //Listen for update panel
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
        //Re-initialize jquery after an auto post back.
        function EndRequestHandler(sender, args) {
            //Do work after update panel fires.
        } 
    });

So essentially you will have your jQuery code and then the same code inside the EndRequestHandler function if you want it to be able to run after a post back.

回答2:

You could use ASP.Net Ajax's pageLoad() method to call your highlight logic like so:

<script type="text/javascript">
function pageLoad(){
    $('#shdr').effect('highlight', {}, 3000);
};
</script>

This will automatically be called on every partial callback as well as regular callbacks.

回答3:

If you want some javascript to run with every panel refresh you could add the following script to your page. This will register a javascript function to run whenever the UpdatePanel refreshes.

<script type="text/javascript">
    function NameOfJavascriptFunctionYouWantToRunHere()
    {
        $('#shdr').effect('highlight', {}, 3000);
    };

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_pageLoaded(NameOfJavascriptFunctionYouWantToRunHere);
</script>

来源：https://stackoverflow.com/questions/5098228/jquery-effect-highlight-not-working-in-asp-net-update-panel

标签

jquery

ASP.NET

ajax

jquery-ui

updatepanel