避免每次單擊鏈接時打開相同的對話框

我有一個菜單，菜單中的每個鏈接都通過模態對話框打開。我試圖避免每次單擊一個鏈接不止一次創建相同的對話框。避免每次單擊鏈接時打開相同的對話框

我已經試過檢查

if(outputHolder.hasClass('ui-dialog-content:visible')){return false;} 
$("body").append(outputHolder); 
outputHolder.load($this.attr("href"), null, function() {  
outputHolder.dialog(

否則將顯示對話框..

任何建議？

完整代碼

http://jsfiddle.net/6qgTr/5/

來源

2013-04-10 Andrés Da Viá

沒有任何反應，當我點擊小提琴的搜索鏈接。應該發生什麼？ – 2013-04-10 15:33:31

所以你應該說你想在每個菜單鏈接上使用不同的模態彈出窗口？小提琴不再工作 – 2013-04-10 15:35:01

即時通訊說，每次我點擊搜索它會創建一個新的對話框..所以即時通訊想知道如何避免這種行爲，並使對話彈出只有一次，當鏈接被點擊。 – 2013-04-10 16:01:40

你想，這樣只有在第一次顯示該對話框的AJAX調用時，但在隨後的點擊，該對話框沒有Ajax調用正在重塑，重新顯示正確？

如果是這樣的話，我認爲你首先必須擺脫下面的代碼，因爲它關閉時刪除了對話框的元素。沒有它，元素將保持不變，但被隱藏。

close: function(event, ui) { $(this).remove(); }

您還需要跟蹤對話框div元素，以便您可以重新使用它們。你可以使用.data()這個方法。

function openDialog($dialogDiv) { 
    $dialogDiv.dialog({ 
     // options, but not including 'close' 
    }); 
} 

function loadEmployeesShow(link) { 
    var $link = $(link), 
     $dialogDiv = $link.data('dialogDiv'); 
    if (!$dialogDiv) { 
     console.log('creating new dialog'); 
     $dialogDiv = $('<div>'); 
     $link.data('dialogDiv', $dialogDiv); 
     $dialogDiv.load($link.attr('href'), function() { openDialog($dialogDiv); });  
    } else { 
     console.log('reusing existing dialog'); 
     openDialog($dialogDiv); 
    } 
};

jsfiddle

來源

2013-04-11 01:41:35