jQuery.mobile Popup sofort versteckt nach der Anzeige

Question

Ich habe eine kleine Phonegap-Anwendung mit Jquery Mobile und Backbone. Ich versuche, dem Benutzer Popup anzuzeigen, indem manuell die .popup() -Methode aufgerufen wird.

Alles funktioniert gut auf iOS, aber auf Android habe ich seltsames Problem: Popup wird für einige Momente angezeigt und dann verschwinden.

Hier ist der eigentliche Code:

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

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

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

Ich Geschichte mit: falsch, weil diese Popup actualy Teil Unterseite ist. Der Code sieht sehr einfach aus, ich kann einfach nicht verstehen, warum es verschwinden kann, und warum dies nur auf Android-Geräten passieren.

Danke, und Entschuldigung für mein schlechtes Englisch.

Answer 1

Ich habe genau das gleiche Problem beim Versuch, Popup ('open') auf einem Android 2.3 Gerät (sowohl im nativen Browser und in Firefox) zu verwenden und es funktioniert gut auf Browsern auf anderen Geräten. Ich benutze auch Backbone-Event-Management, um mein Popup zu öffnen (verwendet das Tap-Ereignis und keine zusätzlichen Optionen zum Popup).

Was ich getan habe, um das Problem zu "korrigieren", ist, dass ich die Backbone-Event-Management für dieses Ereignis entfernt und einen Listener in der Render-Funktion hinzugefügt. In Ihrem Fall etwas, würde wie folgt aussehen:

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)); 
    } 

Ich habe keine Ahnung, wo das Problem herkommt (muss eine Inkompatibilität zwischen Rückgrat und jquery mobil sein) und warum wir es nur auf Android sehen, aber für den Moment mit Diese Problemumgehung scheint meine App auf jedem Gerät zu funktionieren.

Edit: oops, es stellt sich heraus, dass in meinem Fall das Problem war, ich fehlte "Return false;" in der Funktion, die sich mit dem Ereignis beschäftigt. Nun, da ich es hinzugefügt habe, funktioniert es ordnungsgemäß mit dem Backbone-Event-Management. Leider erklärt das nicht, warum Sie das Problem haben und warum ich es nur auf Android gesehen habe.

Answer 2

Ich verbrachte Stunden damit, dieses Problem zu beheben.

Endlich endete ich die folgenden zwei Dinge, die das Problem zu beheben schienen.

1 - Verwenden Sie die unkomprimierte jqm-Datei. d. h. jquery.mobile.1.2.0.js

2 - Ich habe das Popup programmatisch mit der Option 'tap' ausgelöst - nach der Änderung der Option 'klick' funktionierte es.

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

Answer 3

Im Fall hilft es jemanden, ich hatte das gleiche Problem mit Bing Maps auftreten, mit dem Microsoft.Maps.Events.addHandler(pin, 'click', callback) Verfahren.

Nicht besonders schön, sondern ich eine ID in pushpin._id gespeichert und tat das folgende:

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

Answer 4

Ich habe nicht das Gefühl, meine .tap wie das Ändern() Ereignisse in das Click-Ereignis und ich nicht habe einen Fall, wo ich preventDefault() verwenden könnte, also habe ich gerade ein Timeout zu der Popup ('open') Zeile hinzugefügt. Mein Hoverdelay in jqm ist auf 150 gesetzt, also habe ich dieses Timeout auf 600 gesetzt, nur um auf der sicheren Seite zu sein. Funktioniert gut, fühlt sich nicht träge für den Benutzer.

Answer 5

Ich verbrachte Stunden damit, dieses Problem zu beheben.

Endlich endete ich die folgenden zwei Dinge, die das Problem zu beheben schienen.

dieser Code-Schnipsel können Ihnen helfen ->

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

Bitte beachten i e.perventDefault().

Answer 6

Eine Möglichkeit, 'fix' ist es data-history="false", indem auf dem Popup-div

auch

See verwendet habe Diese Frage

JQuery Mobile popup with history=false autocloses

Answer 7

Eine Brute-Force-Option ist check whether popup was hidden und öffnen Sie es erneut.

In einer Schleife, weil die genaue Zeit, die das Popup ausgeblendet wird, variiert wird.

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

Ein Arbeitsbeispiel: http://jsfiddle.net/ArtemGr/hgbdv9s7/

Eine weitere Möglichkeit zu popupafterclose binden könnte:

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

wie hier: http://jsfiddle.net/ArtemGr/gmpczrdm/

Aber aus irgendeinem Grund versagt die popupafterclose Bindung Feuer auf iPhone 4 die Hälfte der Zeit.