2014-04-04 20 views
10

Facendo clic sulla barra del titolo della finestra di dialogo, IE scorre la pagina nella parte superiore della finestra di dialogo se la finestra di dialogo è posizionata parzialmente fuori dalla pagina. Ma questo succede anche se un utente fa clic sul pulsante di chiusura. Ciò significa che l'utente deve fare clic due volte sul pulsante di chiusura.La finestra di dialogo jQueryUI scorre in alto quando si fa clic sul pulsante Chiudi in IE

$('#divDialog').dialog({height:500, position:[10, 1000]}); 

ho creato un jsfiddle per dimostrare: http://jsfiddle.net/e9zAK/

Riposizionare la finestra di dialogo fino a quando non è parzialmente fuori dallo schermo. Quindi provare a fare clic sul pulsante Chiudi. Scorrerà la pagina per adattarla, ma in realtà non chiuderà la finestra di dialogo. Questo non sembra accadere in Firefox o Chrome.

C'è un modo per ignorare questa funzionalità? Non voglio usare la posizione: riparato.

risposta

6

Più stranezza di IE. Invia l'evento mouse, ma non il mouseup e quindi non l'evento click. Non so che cosa provoca questo, ma si può lavorare intorno ad esso legandosi un listener per mouseDown:

$('.ui-dialog-titlebar-close').mousedown(function() { 
    $('#divDialog').dialog('close'); 
}); 

questo sembra un po 'brutto hack, ma questi sembrano essere l'approccio comune quando si tratta di IE.

+0

Grazie per aver trovato la causa principale, ma questo non sembra impedirlo. (Http://jsfiddle.net/e9zAK/1/). Continuerò a scavare anche io. – user1219358

+0

Lo hai nell'ordine sbagliato, nel tuo violino. Mettilo dopo la chiamata a '.dialog()', o in alternativa usa la delega degli eventi: http://jsfiddle.net/blgt/e9zAK/2/ – blgt

1

Sono venuto qui perché avevo un problema simile. Nel mio caso stava accadendo in Chrome (53.0.2785.143 m, Windows) ed è stato attivato quando si fa clic su un pulsante posizionato all'interno della barra del titolo, causando un salto quando la pagina, con la sua finestra di dialogo, è stata scorsa di alcuni (o diversi) pixel da la parte superiore, rimettendola in cima alla finestra e non attivando ciò che il pulsante avrebbe dovuto fare.

Dopo alcune indagini, soprattutto con l'aiuto di Chrome js debugger per sé, ho trovato un listener di eventi su ui-dialog-titlebar, che corrisponde alla barra del titolo finestra di dialogo, e whas innescato con l'mousedown evento (più informazioni linea di circa 9161, di file jquery-ui.js, jQuery UI v1.9.2, probabilmente è risolto nelle versioni più recenti). Dopo che era chiaro che la rimozione del gestore avrebbe risolto il problema, che ho fatto sull'evento open nel codice di inizializzazione di dialogo:

$(".selector").dialog({ 
    open: function(event,ui){ 
     $(this).parent().find('.ui-dialog-titlebar').unbind('mousedown'); 
    } 
}) 

Si noti che questo sarà probabilmente interferirà nel caso abbiate qualche azione di trascinamento legato alla barra del titolo, però.

+0

perfetto, questo finalmente lo ha risolto per me. Fortunatamente non ho alcun evento ondrag per la barra del titolo .. –