JQuery模態對話框 - 銷燬還是關閉？

我最近遇到過一種情況，我對使用JQueryUI模態對話框時應該使用哪種技術有些困惑。JQuery模態對話框 - 銷燬還是關閉？

我有一個功能：ClearDay（weekID，ltDayID）。目前這是負責創建一個對話框有兩個按鈕：確定和取消。

ok將觸發ajax調用，將weekID和ltDayID傳遞到服務器。
取消將清空對話框的div並在目標div上調用.dialog('destroy')。

我的問題是：我應該採用哪種方法？

銷燬/重新創建每次通話對話框 - 這樣我就可以將參數傳遞給Ajax調用只有一個DIV所有對話框的在標記

function ClearDay(weekID, ltDayID) { 

    $('#modalDialog').dialog({ 
     autoOpen: true, 
     width: 300, 
     title: 'Confirm Delete', 
     modal: true, 
     buttons: [{ 
      text: 'ok', 
      click: function (e) { 

       $(this).dialog('close'); 

       $.ajax({ 
        url: '/Shift/ClearDay', 
        type: 'POST', 
        cache: false, 
        data: { shiftWeekID: weekID, shiftLtDayID: ltDayID }, 
        success: function (result) { 

         LoadShiftPattern(function (result) { 

          $('#weekContainer').html(result); 

          SelectLastUsedField(); 
         }); 

        } 
       }); 
      } 
     }, 
      { 
       text: 'cancel', 
       click: function (e) { 
        $('#errorList').empty(); 
        $(this).dialog('close'); 
       } 
      }], 
     open: function (e) { 

      $(this).html("Clicking ok will cause this day to be deleted."); 

     }, 
     close: function (e) { 
      $(this).empty(); 
      $(this).dialog('destroy'); 
     } 
    }); 

}

創建對話框只有一次，但具有一個DIV用於在標記中的每個對話，使用關閉，並在值通過直接使用jQuery選擇

$(function() { 

$('#confirmDeleteDialog').dialog({ 
     autoOpen: false, 
     width: 300, 
     title: 'Confirm Delete', 
     modal: true, 
     buttons: [{ 
      text: 'ok', 
      click: function (e) { 

       $(this).dialog('close'); 

       $.ajax({ 
        url: '/Shift/ClearDay', 
        type: 'POST', 
        cache: false, 
        data: { shiftWeekID: $('#weekIDInput').val(), shiftLtDayID: $('#dayIDInput').val()}, 
        success: function (result) { 

         LoadShiftPattern(function (result) { 

          $('#weekContainer').html(result); 

          SelectLastUsedField(); 
         }); 

        } 
       }); 
      } 
     }, 
      { 
       text: 'cancel', 
       click: function (e) { 
        $('#errorList').empty(); 
        $(this).dialog('close'); 
       } 
      }], 
     open: function (e) { 

      $(this).html("Clicking ok will cause this day to be deleted."); 

     } 
    }); 
} 

function ClearDay() { 

    $('#confirmDeleteDialog').dialog('open'); 

}

個

乾杯，

詹姆斯

來源

2011-04-15 Zack

說實話，我不確定。不過，您可以使用JavaScript分析器來測量執行任何一種方式所需的時間。

這裏是一個迷你指南的鏈接在谷歌Chrome的開發者工具的JavaScript探查http://code.google.com/chrome/devtools/docs/profiles.html

我建議第二個選項會比較慢，因爲我猜在「數據」的選擇將需要進行評估，因此使其變慢。

但是，這將取決於對話打開/關閉的次數。正如我猜測的那樣，摧毀和重建將會很緩慢（眨眼之間 - 但也許會慢一點）。

第一個看起來更簡單的實現，所以如果性能似乎不成問題 - 也許只是選擇兩者中較簡單的一個。

來源

2011-04-15 08:29:01

第二個也會導致jquery離開對話框的所有html代碼內容，這是在所有監聽器正在建立對話框時添加的。這是第二個解決方案，因爲用了很多對話，速度更慢。 – elon 2013-02-13 15:36:04

這取決於你有多少元素使用功能ClearDay。如果元素的數量很大，那麼第二種方法即。（創建一個對話框並重新使用它）是一種好方法，反之亦然。

來源

2011-04-15 08:25:29 001priyank

JQuery模態對話框 - 銷燬還是關閉？

回答

相關問題