Impedire jQuery Mobile di chiudere un popup quando l'utente tocca al di fuori di esso

Question

sto usando jQuery Mobile 1.2.0 alpha 1.

Attualmente, quando apro un popup e toccare al di fuori di esso in qualsiasi punto dello schermo popup è chiuso Mi chiedevo se c'è qualche attributo di JQuery Mobile che mi è mancato e che può essere impostato e impedire la chiusura del popup al di fuori, toccare? (Popup modale)

(La documentazione per i popup può essere trovata here)

EDIT:

ho avuto un'idea per risolvere questo, ma ancora non può implementare per lavorare:

Quando compare un popup JQM c'è un div che copre tutto lo schermo con una classe di schermo ui-popup. Ho pensato in qualche modo di dargli un grande z-index e di separare tutte le funzioni click/tap da esso. Fare questo non risolve il mio problema ma immagino che sia un piccolo passo nella direzione.

Thnx in anticipo.

Answer 1

Questo è stato aggiunto come richiesta di funzionalità su Github. Vedere il numero here.

Come uno scribacchino per questo nel frattempo è quello di dissipare gli eventi sullo schermo ui-popup. Metterei il seguente codice nel pageinit.

$("#yourPopupId").on({ 
    popupbeforeposition: function() { 
     $('.ui-popup-screen').off(); 
    } 
}); 

Questo è un quickfix dalle mani pesanti, ma funziona.

Answer 2

Sulla @ eccellente soluzione di TheGwa, ecco una generalizzazione per preparare la prossima uscita ufficiale (presumibilmente, nella versione 1.3):

• Aggiungi data-dismissible='false' alla marcatura di tutti i popup che non si desidera essere licenziabili toccando al di fuori di essi.

• Aggiungi il seguente gestore di eventi alla tua app; che gestirà tutti i popup:

_

$(window).on('popupbeforeposition', 'div:jqmData(role="popup")', function() { 
     var notDismissible = $(this).jqmData('dismissible') === false; 
     if (notDismissible) { 
      $('.ui-popup-screen').off(); 
     } 
}); 

-

Una volta che la funzione è ufficialmente supportato, è sufficiente rimuovere il gestore di eventi.

Si noti che, purtroppo, la documentazione ufficiale (a partire da 1.2) suggerisce che la funzione è già disponibile, ma non è - vedi http://jquerymobile.com/test/docs/pages/popup/options.html

Answer 3

Per i ricercatori futuri, a partire dal 1.3, questo è ora supportato. Basta aggiungere l'attributo data-dismissible="false" al pannello div.

Answer 4

Aggiungi data-dismissible = "false" nel modo seguente.

<div data-role="popup" id="popupnotification" data-overlay-theme="b" data-theme="c" data-position-to="window" style="max-width:600px;"> 

Answer 5

@ MJB -> Se si desidera poter fare clic in qualsiasi punto (ad es.su un pulsante), quando un pop-up è attiva, è possibile modificare il CSS del pop-up come segue:

.ui-popup-screen{ 
        position: relative; 
       } 

Questo ha funzionato per me.

Nota: pop-up non si chiude al clic più quando si esegue questa operazione - ho fatto una soluzione alternativa:

$(window).click(function() {  
    if ($("#myPopup-popup").hasClass("ui-popup-active")){ 
     $("#myPopup").popup("close"); 
    } 
}); 

l'ID myPopup-popup è generato da jQm - myPopup è l'ID ho dato il pop-up.