Question

我有一个按钮，可在单击时打开对话框。该对话框显示隐藏的div

单击X图标关闭对话框后，无法再次打开对话框。

Answer 1

Scott jonzalez（jQuery UI团队）在最近的博客文章中讨论了很多人在开始使用jQuery UI时遇到此问题的原因：http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/

摘录：

用户经常遇到的问题   他们试图用对话框   每次都实例化一个新对话框   用户执行某些操作   （通常点击链接或   按钮）。这是可以理解的   错误，因为乍一看它   好像在调用.dialog（）   元素是导致对话框的原因   打开。实际上正在发生的事情是   正在建立一个新的对话框实例   创建然后该实例是   紧接着被打开   实例。之所以如此   对话框打开是因为对话框有   autoOpen选项，默认为   真正。所以当用户调用.dialog（）时   在元素上两次，第二次调用   被忽略，因为对话框有   已经实例化了   元件。

解决方案：

这个问题的简单解决方案是   使用实例化对话框   autoOpen设置为false然后调用   事件处理程序中的.dialog（'open'）。

$(document).ready(function() {
    var $dialog = $('<div></div>')
        .html('This dialog will show every time!')
        .dialog({
            autoOpen: false,
            title: 'Basic Dialog'
        });

    $('#opener').click(function() {
        $dialog.dialog('open');
    });
});

Answer 2

您使用的是ui对话框吗？您应该发布一些代码，以便我们可以看到导致问题的原因。但这里有一个猜测（因为我最近犯了同样的错误）。使用ui对话框时，您只需要初始化对话框一次。

 $(document).ready(function() {
   $('#dialog').dialog({
     autoOpen:false,
     modal:'true',
     width:450,
     height:550
  });
 $('#MyButton').click(openDialog);    

});

此代码初始化对话框但不显示。单击MyButton时，openDialog函数将打开对话框。

   var openDialog = function(){

       $('#dialog').load('loadurl.php');//load with AJAX

      //optionally change options each time it is clicked
       $('#dialog').dialog('option', 'buttons',{
          "Cancel":function(){
             $('#dialog').dialog('close');
          }
      });

     //actually open the dialog
     $('#dialog').dialog('open');

};

Answer 3

作为对已接受答案的补充，我想补充一点，在asp.net更新面板中使用时需要注意。如果单击该按钮，则会发生回发，弹出窗口将打开但由于发生了回发而未能再次打开。因此，您应该确保用于打开弹出窗口的按钮不会回发。即：

<asp:LinkButton ID="btn1" runat="server" OnClientClick="return false;">Click me</asp:LinkButton>

jquery ui对话框只打开一次

3 个答案: