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