2009-11-09 229 views
24

我有一个按钮,单击时会打开一个对话框。 对话框显示一个被隐藏的divjquery ui对话框只打开一次

当我通过单击X图标关闭对话框后,对话框无法再次打开。

+5

的邮递区号或链接... :-( – beggs 2009-11-09 15:57:39

+0

你在使用隐藏和显示该对话框 – 2009-11-09 15:57:48

+0

一些代码将是真棒一般,不要忘了代码,以确保您在关闭时不会导致任何错误 – helloandre 2009-11-09 15:57:56

回答

39

斯科特(的jQuery UI的团队)冈萨雷斯谈到人的原因很多有这个问题在最近的一篇博客的时候开始使用jQuery用户界面:http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/

的摘录:

用户经常遇到 与对话框的问题是,他们尝试 每次实例化一个新的对话框 用户执行一些操作 (通常点击al墨水或按钮)。这是一个可以理解的 错误,因为乍一看它 看起来像调用.dialog() 元素是导致对话框 打开的原因。实际上,发生的事情是 ,即新创建的对话实例为 ,然后在 实例化后立即打开该实例 。 对话框打开的原因是因为对话框有 autoOpen选项,默认为 为true。因此,当用户在一个元素上调用.dialog() 两次时,第二个调用 将被忽略,因为该对话框已经在该元素上实例化了 。

解决方案:

简单的解决这个问题是 实例与 对话框的AutoOpen设置为false,然后调用 .dialog在事件处理程序(“公开”)。

$(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'); 
    }); 
}); 
+0

如果对话框已初始化并显示在事件中,会发生什么情况?是否存在性能风险或仅仅是不好的做法? – 2015-06-17 00:08:05

+0

不起作用,也许只是这个对话框的糟糕设计? – jpganz18 2017-06-13 16:06:07

8

你使用的是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'); 

}; 
0

作为除了公认的答案我想补充一点,你需要注意的一个asp.net的UpdatePanel使用这个时候。 如果您单击该按钮,则会发生回发,弹出窗口将打开,但由于发生回发而不会再次打开。所以你应该确保你用来打开弹出窗口的按钮不会回发。 即:?

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