燈箱裏面一個GridView的TemplateField

Question

<script type="text/javascript"> 
     $(document).ready(function() { 
      $("#LightBox").click(function() { 
       $.fancybox.open({ 
        href: ($('#LightBox').val()), 
        type: 'iframe', 
        padding: 7 
       }); 
      }); 
     }); 
    </script> 

---

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
         DataSourceID="SqlDataSource1" > 
         <Columns> 
         <asp:TemplateField> 
         <ItemTemplate> 
         <asp:Button ID="LightBox" runat="server" Text="http://www.apple.com/ipod" /> 
         </ItemTemplate> 
         </asp:TemplateField> 
         </Columns> 
    </asp:GridView> 

如果我把按鈕的燈箱作品fine..I不明白爲什麼它不會從模板列內觸發GridView的外面。

Answer 1

可與下面的代碼（使用類代替ID）

<script type="text/javascript"> 
     $(document).ready(function() { 
      $(".LightBox").click(function() { 
       var url = $(this).val(); 
       $.fancybox.open({ 
        href: url, 
        type: 'iframe', 
        padding: 7 
       }); 
      }); 
     }); 
    </script> 

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
         DataSourceID="SqlDataSource1" > 
         <Columns> 
         <asp:TemplateField> 
         <ItemTemplate> 
         <asp:Button ID="LightBox" CssClass="LightBox" runat="server" Text="http://www.apple.com/ipod" /> 
         </ItemTemplate> 
         </asp:TemplateField> 
         </Columns> 
    </asp:GridView> 

試圖