簡單的jQuery模式彈出窗口未顯示在gridview按鈕上

Question

我已經將bPopup用作jquery plugin.link是： http ://www.jqueryscript.net/lightbox/Lightweight-jQuery-Modal-Popup-Plugin-bPopup.html

這是帶有按鈕字段的gridview。

              <asp:GridView ID="gvwData" runat="server" 
                   AllowPaging="True" AutoGenerateColumns="False" >                                                                                                                                                                                                                                                                      
                    <Columns>
                        <asp:TemplateField HeaderText="preview">
                        <ItemTemplate>                              
                          **<asp:Button id="mybutton" runat="server" Text="click"/>**
                        </ItemTemplate>

                        </asp:TemplateField>

                    </Columns>
                    <AlternatingRowStyle Width="220px" />
                </asp:GridView>

這是JavaScript函數：

 <script type="text/javascript">

      $(document).on("click", "[id*=mybutton]", function(e) {

        e.preventDefault();     

          **$('#elementtopopup').bPopup();**

 });  (jQuery);


</script>

$（'＃elementtopopup'）。bPopup（）未顯示。 以下是我遇到的錯誤的屏幕截圖。

控制台錯誤的屏幕截圖

Answer 1

將插件添加到頁面底部

<script src="jquery.bpopup-0.8.0.min.js"></script>//change it to the path of the js file

Answer 2

我認為您的選擇器對於該按鈕是錯誤的，應該是：

$(document).on("click", "[id$='mybutton']", function(e) {
    // code
});

Web表單在ID后面加上您指定的ID，而不是在選擇器要查找的ID前面加上前綴。