jQuery在ASP.NET UpdatePanel中不起作用

Question

我有一个ASP.NET GridView ，其中有一个列作为链接 -按下该链接将触发JQuery调用并打开一个花式框。 一切都按预期进行，直到我在UpdatePanel中移动代码。

一旦进入UpdatePanel，该链接将不再起作用。 如果我从UpdatePanel中取出所有内容，一切都将再次正常运行。

如何启用JQuery从updatePanel内部识别GridView链接？

            $("a.grid").click(function () {
            var ID = this.id;
            $.fancybox({
                'scrolling': true,
                'autoSize': false,
                'width': 1015,
                'height': 515,
                'transitionIn': 'fade',
                'transitionOut': 'fade',
                'speedIn': 200,
                'speedOut': 300,
                'type': 'iframe',
                'href': 'general_stats.aspx?ID=' + ID
            });
        });

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
CellPadding="4" DataSourceID="SqlDataSourceGenStats1" Font-Size="Smaller" 
ForeColor="#4C98AA" GridLines="None" Width="669px" Visible="False">
<AlternatingRowStyle BackColor="White" />
<Columns>
    <asp:BoundField DataField="PERSON_ID" HeaderText="Person ID" 
        SortExpression="PERSON_ID" />
    <asp:BoundField DataField="FIRST_NAME" HeaderText="First Name" 
        SortExpression="FIRST_NAME" />
    <asp:BoundField DataField="LAST_NAME" HeaderText="Last Name" 
        SortExpression="LAST_NAME" />
    <asp:TemplateField HeaderText="View Stats">
    <ItemTemplate>
    <a class="grid" id="<%# Eval("PERSON_ID") %>" href="#">View</a>
    </ItemTemplate>
        <ItemStyle HorizontalAlign="Center" />
    </asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#2461BF" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#4C98AA" Font-Bold="True" ForeColor="White" 
    HorizontalAlign="Left" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB" />
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />

Answer 1

您可能需要注册调用，以使用PageRequestManager绑定到click事件处理程序。 可以在这里找到更多详细信息： http : //msdn.microsoft.com/zh-cn/library/bb311028(v=vs.100).aspx

在更新面板上方是这样的：

jQuery(document).ready(function () {
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(
  function() {
    $("a.grid").click(function () {
        var ID = this.id;
        $.fancybox({
            'scrolling': true,
            'autoSize': false,
            'width': 1015,
            'height': 515,
            'transitionIn': 'fade',
            'transitionOut': 'fade',
            'speedIn': 200,
            'speedOut': 300,
            'type': 'iframe',
            'href': 'general_stats.aspx?ID=' + ID
        });
    });
  }
);
});

由于回发，部分回发后可能未加载处理程序。 此调用将在回发和异步回发后加载处理程序。

Answer 2

Sys.Applicaiton.add_load（）事件处理程序

http://www.codeproject.com/Articles/534587/ASP-NET-jQuery-is-not-Working-in-UpdatePanels