2010-01-19 16 views
5

Pracuję z IE7 i niektórymi oknami dialogowymi jQuery i mam problem z otwarciem około 6megów na jedno okno dialogowe. Zakładam, że ma to związek z zamknięciami, ale jak dotąd wszystko, co zrobiłem, aby je usunąć, nie pomogło. W tym momencie myślę, że zająłem się wszystkimi zamknięciami za wyjątkiem funkcji zwrotnej, którą przekazuję, ale nadal przecieka ona 6 megawatów nawet po zamknięciu i usunięciu okna dialogowego. Odpowiedni kod źródłowy jest:Wycieki okien dialogowych jQuery-UI

function DialogDestroyAndRemove(event) { 
    $(event.target).dialog("destroy").remove(); 
} 

function CallbackAndCloseDialog(event) { 
    if (event.data.callback != undefined) { 
     event.data.callback(event.data.callbackResponse); 
    } 
    $("#" + event.data.dialogId).unbind('dialogbeforeclose').dialog('close'); 
} 

// alert dialog modal with ok button 
function AlertDialog(dialogTitle, dialogText, callbackFunction) { 
    // dynamically generate and add a div so we can create the pop-up 
    $('body').append("<div id=\"alertDialog\" style=\"display:none;\" title=\"" + dialogTitle + "\">" + dialogText + "</div>"); 

    // define/configure the modal pop-up 
    $("#alertDialog").dialog({ 
     draggable: false, 
     resizable: false, 
     modal: true, 
     autoOpen: true, 
     open: function() { 
      $("#alertDialog").parents('.ui-dialog-buttonpane button:eq(0)') 
      .focus() //focus so the button is highlighted by default 
      .bind('click', { 
       callback: callbackFunction, 
       callbackResponse: 'OK', 
       dialogId: 'alertDialog' 
      }, CallbackAndCloseDialog); 
     }, 
     overlay: { backgroundColor: '#000', opacity: 0.5 }, 
     buttons: { 'OK': function() { } } 
    }).bind('dialogbeforeclose', function(event, ui) { 
     // Close (X) button was clicked; NOT the OK button 
     if (callbackFunction != undefined) { 
      callbackFunction('cancel'); 
     } 
     callbackFunction = null; 
    }).bind('dialogclose', DialogDestroyAndRemove); 
} 

Jedno zrobiłem powyżej, że nie jestem pewien, czy to było potrzebne zamiast definiowania zwrotnego dla przycisku OK, gdy jest zdefiniowana (a więc konieczności zamknięcia, ponieważ jest to odwołanie do oddzwanianie), aby zdefiniować go za pomocą .bind po otwarciu okna dialogowego. Miałem nadzieję, że możliwość przekazania wywołania zwrotnego jako części danych do zdarzenia kliknięcia może pomóc w usunięciu zamknięcia.

Wszelkie pomysły, co jeszcze mogę zmienić, aby pozbyć się tego wycieku?

Odpowiedz

5

W rzeczywistości spowodowało to, w jaki sposób struktura interfejsu jQuery obsługuje wyszarzanie tła podczas wyświetlania modalu. Po usunięciu atrybutów modal = true i overlay, wyciek pamięci spadnie do ~ 100k.

Aby obejść ten problem, musiałem utworzyć okno dialogowe bez opcji modalnej, a następnie dodać element div do strony (stała pozycja górna, lewa, dolna, prawa wszystkie 0 z naprzemiennie szarym pikselem, a następnie przezroczyste tło pikselowe) i pokazywanie i ukrywanie tego za pomocą zindeksu tuż pod oknem dialogowym.

Chociaż nie jest idealny (domyślna nakładka modalna była ładna i gładka), to lepsze niż wyciekanie dużej ilości pamięci w jednym oknie dialogowym.

+1

To ma związek z tym, jak IE obsługuje przezroczystość PNG, która jest ... okropna. Jeśli używasz prostego, kolorowego filtra IE zamiast obrazu, możesz uzyskać efekt bez pamięci. W twoim jQuery.UI.css zmień klasę '.ui-widget-overlay' i usuń wszystko z' url ('naprzód w deklaracji' background: ', spowoduje to jednokolorową nakładkę półprzezroczystą –

+0

Wydaje się być z w jaki sposób IE radzi sobie z ogólną przejrzystością, usunąłem aspekt adresu URL w tle (pozostawiając tylko jednolity kolor) i nadal to robiłem, dopóki nie usunąłem filtru przezroczystości, który zniknął – Parrots

+0

Właściwie usuwanie modalu: true z mojego okna dialogowego przecięło użycie pamięci IE 8 w połowie (od 150 MB do 70). – daschl

1

Mam nadzieję, że to pomogło, utworzyłem rozszerzenie dla tego problemu, w którym używam narzędzi jQuery (flowplayer) ujawnić wtyczkę, gdy modal = true dla okna dialogowego interfejsu użytkownika jQuery.

Chciałbym dołączyć folmttp: //jsfiddle.net/yZ56q/nowy kod w osobnym pliku .js i upewnij się, że zawiera narzędzia jQuery odsłonić wtyczkę wcześniej, z tej strony ... http://flowplayer.org/tools/download.html.

(function($) { 
    var _init = $.ui.dialog.prototype._init; 
    $.ui.dialog.prototype._init = function() { 
     var self = this; 
     _init.apply(this, arguments); 

     // Remove the default modal behavior and exhibit the new one 
     if (self.options.modal) { 
      self.options.modal = false; 
      self.options.isModal = true; 
     } 

     this.uiDialog.bind('dialogopen', function(event, ui) { 
      if (self.options.isModal) { 
       if ($(this).expose == null) 
        window.alert("Dialog box depends on the expose plugin to be modal. Please include the jquery tools Javascript include."); 
       else { 
        $(this).expose({ opacity: 0.3 
          , color: '#CCCCCC' 
          , loadSpeed: 0 
          , closeSpeed: 0 
          , closeOnClick: false 
          , closeOnEsc: false 
          , api: true 
        }).load(); 
       } 
      } 
     }); 

     this.uiDialog.bind('dialogfocus', function(event, ui) { 
      if (self.options.isModal) { 
       $(this).css('z-index', '9999'); 
      } 
     }); 

     this.uiDialog.bind('dialogclose', function(event, ui) { 
      if (self.options.isModal) { 
       if ($(this).expose != null) { 
        $(this).expose({ api: true }).close(); 
       } 
      } 
     }); 
    }; 

     $.ui.dialog.defaults.isModal = false; 
})(jQuery); 
Powiązane problemy