android - una - La ventana emergente de jQuery.mobile se oculta inmediatamente después de mostrarse

jquery mobile opinion

Question

Tengo una pequeña aplicación de teléfono con jquery mobile y backbone. Intento mostrar el mensaje emergente al usuario llamando manualmente al método .popup ().

Todo funciona bien en iOS, pero en Android tengo un problema extraño: la ventana emergente se muestra durante unos momentos y luego desaparece.

Aquí el código real:

var PostView = Backbone.View.extend({
  events: {
    ''touchend .add-comment-button'': ''addComment''
  },
  addComment: function() {

    this.$(".comment-popup").popup(''open'', { history: false });

    return false; // Stop bubbling.
  }
});

Estoy usando history: false porque esta ventana emergente es en realidad parte de la subpágina. El código se ve muy simple, simplemente no puedo entender por qué puede desaparecer y por qué esto sucede solo en dispositivos Android.

Gracias, y perdón por mi mal inglés.

Answer 1

En caso de que ayude a alguien, tuve el mismo problema con Bing Maps, con el método Microsoft.Maps.Events.addHandler(pin, ''click'', callback) .

No es particularmente agradable, pero en su lugar pushpin._id una identificación en pushpin._id e hice lo siguiente:

$("#page").on(''vclick'', function (event) {
    if (event.target.parentElement.className === "MapPushpinBase") {
        $("#stopPopup").popup(''open'');
    }
});

Answer 2

No tenía ganas de cambiar mis eventos .tap () al evento click y no tenía un caso en el que pudiera usar preventDefault () así que acabo de agregar un tiempo de espera a la línea emergente (''open''). Mi hoverdelay en jqm está configurado en 150, así que establecí este tiempo de espera en 600 para estar seguro. Funciona bien, no se siente lento para el usuario.

Answer 3

Pasé horas intentando solucionar este problema.

Finalmente terminé haciendo las siguientes dos cosas que parecían arreglar el problema.

1 - Usa el archivo jqm sin comprimir. es decir, jquery.mobile.1.2.0.js

2 - Estaba activando la ventana emergente programáticamente usando la opción ''tocar'' - una vez cambiada a la opción ''clic'' funcionó.

$(''.option'').live(''click'', function() {
    $(''#popup-div'').popup(''open'');
}); 

Answer 4

Pasé horas intentando solucionar este problema.

Finalmente terminé haciendo las siguientes dos cosas que parecían arreglar el problema.

este fragmento de código puede ayudarlo ->

$(''#testBtn'').on(''tap'',function(e){
   console.log("button clicked");
   e.preventDefault();
   $(''#testPOPUP'').popup("open");
});

Tenga en cuenta que he usado e.perventDefault().

Answer 5

Tengo exactamente el mismo problema cuando intento usar popup (''abrir'') en un dispositivo con Android 2.3 (tanto en el navegador nativo como en firefox) y funciona muy bien en los navegadores de otros dispositivos. También estoy usando la gestión de eventos de backbone para abrir mi ventana emergente (utilicé el evento tap y no tuve opciones adicionales para que apareciera).

Lo que hice para ''corregir'' el problema es que eliminé la gestión de eventos backbone para este evento y agregué un oyente en la función de renderizado. En tu caso, esto se vería así:

    events: {
       // ''touchend .add-comment-button'': ''addComment''
    },
    render: function() {
            $(this.el).html(this.template(this.model));
            $(this.el).find(''.add-comment-button'').tap(function(el){
                this.addComment(el);
                return false;
            }.bind(this));
    }

No tengo idea de dónde viene el problema (debe haber alguna incompatibilidad entre la red troncal y el móvil jquery) y por qué solo lo vemos en Android, pero por el momento con esta solución mi aplicación parece funcionar bien en cualquier dispositivo.

Edit: oops, resulta que en mi caso el problema era que me faltaba "return false;" en la función que trata con el evento. Ahora que lo agregué, funciona correctamente con la gestión de eventos de backbone. Lamentablemente, eso no explica por qué tienes el problema y por qué lo estaba viendo solo en Android.

Answer 6

Una forma de ''arreglarlo'' es estableciendo data-history="false" en el menú emergente div

Ver también esta pregunta

Ventana emergente de JQuery Mobile con historial = falsos autocloses

Answer 7

Una opción de fuerza bruta es comprobar si la ventana emergente estaba oculta y volver a abrirla.

En un bucle, porque la hora exacta en que se oculta la ventana emergente parece ser variada.

var hidden = $(''#'' + id + ''-popup'') .hasClass (''ui-popup-hidden'')
if (hidden) $(''#'' + id) .popup (''open'')

Un ejemplo de trabajo: http://jsfiddle.net/ArtemGr/hgbdv9s7/

Otra opción podría ser enlazar a popupafterclose :

var reopener = function() {$(''#'' + id) .popup (''open'')}
$(''#'' + id) .on (''popupafterclose'', reopener)
$(''#'' + id) .popup (''open'')

Me gusta aquí: http://jsfiddle.net/ArtemGr/gmpczrdm/

Pero por alguna razón, el enlace popupafterclose no se popupafterclose en el iPhone 4 la mitad del tiempo.