javascript - 按钮单击事件在弹出窗口中不起作用

在弹出窗口中时，按钮单击事件不会触发，但是在弹出窗口中它可以正常工作，在HTML中，注释部分是我在弹出窗口中调用按钮事件的地方，它可以正常工作，但在弹出窗口中却没有单击“保存”按钮时发生。这是我的代码

  <script>

    $(function () {

         $("#dialog-1").dialog({
             autoOpen: false,
         });

         $("#opener").click(function () {
             $("#dialog-1").dialog("open");

         });
     });
  </script>

HTML

         <%--<asp:Button Text="save" class="btn btn-danger" runat="server"  CausesValidation="false" OnClick="SaveDB" />
           <asp:TextBox ID="TextBox1" runat="server" ></asp:TextBox>--%>

<button type="button" class="btn btn-warning" id="opener" > Create Database       </button>
               <div id="dialog-1" title="Add new Database">
    Database name: <asp:TextBox ID="TextBox1" runat="server" ></asp:TextBox>
    <asp:Button Text="Save" class="btn btn-danger" runat="server"  CausesValidation="false" OnClick="SaveDB" style="padding-left:2%;padding-right:2%;" />
  </div>

aspx.cs文件代码

   protected void SaveDB(object sender, EventArgs e)
  {
       TextBox1.Text="It works";
  }

最佳答案

尝试将事件处理程序附加到body，如下所示：

$("body").on("click", "#opener", function(){
    $("#dialog-1").dialog("open");
});

问题可能是在设置处理程序时DOM中不存在#opener元素，但是将其附加到body可以解决该问题。