当由部分回发加载时，Jquery 在 Asp.net 控件中停止工作

Question

在 ASP.net/C# 应用程序中。 我正在使用更新面板和其中的占位符来动态加载控件

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="LinkButton1" EventName="Click"/>
    </Triggers>
    <ContentTemplate>
        <asp:PlaceHolder ID="PlaceHolder1" runat="server">
        </asp:PlaceHolder>
    </ContentTemplate>
</asp:UpdatePanel>

当我点击 LinkBut​​ton1 时，我在 PlaceHolder 中加载了一个用户控件：

protected void LinkButton1_Click(object sender, EventArgs e)
{
    PlaceHolder1.Controls.Clear();
    MyControl C;
    C = (MyControl1 )LoadControl("Controls/MyControl.ascx");
    PlaceHolder1.Controls.Add(C);
}

我拥有的所有控件都已正确加载。

但问题是这样的：

我有一个控件，当我单击 div 时，它使用 Javascript 和 Jquery 创建下拉动画。 当通过 Normal PostBack 加载到页面上时，此控件可以正常工作 但是当我使用部分回发在更新面板中加载它时，它会加载但 javascript 停止工作（不再有下拉动画和其他内容）

通过部分回发加载控件时如何使它们工作？

Answer 1

当您执行 .bind() 时，您只会为给定时刻存在于 DOM 中的元素连接事件，即当您执行 .bind() 时。您通过部分回发异步加载的控件在 document.ready 中不存在，这就是您的事件不起作用的原因。

您应该使用 live 或 delegate，或者，如果您使用 jQuery 1.7 或更高版本，您应该使用新的on-function：

$(function(){
    $('placeholder-selector').on('click' , 'your-clickable-selector', function(){
        //do your animation here
    });
});

Answer 2

我认为使用 Jquery“Live”可能是您正在寻找的答案，这将监控 DOM 中的变化。

$("{YOURQUERY}").live("click", function(){ alert("再见！"); });

查看 jquery 文档了解更多信息。

Answer 3

我的猜测是您的下拉动画是在 dom 就绪时执行的。因此，您的初始页面加载会在下拉菜单中所需的任何位置设置动画。

通过部分回发，它只有加载的部分，因此没有设置动画。因为它不是最初准备好的 Dom 的一部分。

您需要在返回该部分回帖时触发一些 javascript，以运行您可能必须设置动画的相同功能。

编辑

How to control which JavaScript gets run after UpdatePanel partial postback endRequest?

应该帮助您在更新面板返回后执行 javascript。

Answer 4

我认为您的动画正在 $(document).ready() 事件中注册。然后它在所有 div 上注册，具体动画。 如果您对更新面板进行回发，则不会触发文档就绪事件，因此会注册动画。在更新面板中回发后，您应该自己再次执行此操作。