2009-11-09 140 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>