fastclick.js JQuery Mobile Phonegap und Android

Ich kann nicht alle diese arbeiten zusammen. Ich habe phonegap/JQM läuft mit fastclick.js perfekt auf iOS. Es ist ein Traum. Aber aus irgendeinem Grund bekomme ich noch einen 300ms Verzögerung auf android. Ich habe einige Warnungen und der code aufgerufen wird. Es ist unverständlich, wirklich. Ich bin den Test auf einem motorola droid razor maxx.

In meinem index.html Datei:

<!DOCTYPE html>
<html>
    <head>
        ...
        <script type='application/javascript' src='js/fastclick.js'></script>
    </head>
    <script>
    $(document).on("pagebeforechange", function (e, data) {
        FastClick.attach(document.body);
        alert('fastclick attached');
        var to_page = data.toPage[0].id;
        //skip showing #myPage if condition is true
        if (to_page == "index") {
            $.mobile.pageContainer.pagecontainer('change', 'event-list.html');
            e.preventDefault();
        }
    });

    </script>
    <body>
        <div id="index" data-role="page">
        This is the index page.
        </div>
    </body>
</html>

Aber es scheint nicht zu funktionieren. Ich habe auch versucht Anhängen wie:

window.addEventListener('load', function() {
    new FastClick(document.body);
}, false);

Denen beide arbeiten auf iOS, aber nicht scheinen, um eine Wirkung auf android. Irgendwelche Vorschläge?

edit: Es scheint, wenn ich entfernen Sie die JQuery-Bibliotheken funktioniert es einwandfrei. Es hat doch einen Konflikt irgendwo. Jede Idee, was es sein kann? Ich bin mit JQM 1.4.

edit: ich habe auch versucht, mit vclick ohne Erfolg

$("#test-element").bind('vclick',function() {
    $.mobile.pageContainer.pagecontainer('change', 'description.html?lunch_pk=2133',{
        transition: "slide",
    });
});
...
<h1 id='test-element'> CLICK HERE FOR TEST </h1>

Ich bin auch mit gesten um die Seiten zu wechseln, die auch verzögert wird, wird von 300ms, so dass ich nicht denke, dass selbst wenn vclick war arbeiten, es wäre eine komplett-Lösung.

edit: ok, also nach einigen weiteren Tests, bin ich ziemlich sicher, dass die Verzögerung kommt von innen JQM pagechange Funktionen. Ich habe eine Konsole.melden Sie innerhalb der vclick und ich das log ist ziemlich Ansprechend, wenn Sie die Taste drücken. Ich bin versucht, zu Graben, durch JQM aber nicht sehr erfolgreich, ich meine, warum würde es sein, nahtloser, die auf iOS und nicht auf android? Und vielleicht brauche ich nur eine bessere mobile Bibliothek.

Antwort

Ich war nie in der Lage, dieses problem zu lösen. Meine Lösung war, zu wechseln-Bibliotheken. Ich ging zu Intel ' s mobile app-framework, welches in der Lage war, alles zu tun, die ich Tat, mit JQM nur mehr erfolgreich.

  • welche Versionen benutzt du?
  • Sie sollten wissen, von changePage-Funktion 🙂 JQM 1.4
  • Cordova 3.1, Android 4.2.2 hier. Keine Probleme mit fastclick.js. JQM ist Schuld. Aber scheinbar gibt es etwas namens "vclick".
InformationsquelleAutor Chase Roberts | 2014-02-19
  1. 1

    Können Sie versuchen vclick ohne zu versuchen, onclicks. Diese built-in jQuery Mobile vclick lässt die 300ms delay. Ich Tue dies, indem dies zu tun.

    $("#element").bind('vclick',function(event) {
   yourFunction(this.id);
   event.preventDefault();//this prevents the default click event
});
    • Kein Würfel, ich bin noch immer ein 300ms Verzögerung mit diesem code.
    • Ich benutze diese binden und Ordnung, die in android-und sogar ios, empfehle ich Ihnen zum test eine Bindung zu einem normalen element oder vielleicht, wenn die Veranstaltung.preventDefault() nicht funktioniert, dann löst es die gute alte click-Ereignis zu.
    • Ich aktualisierte die Frage mit ein paar details, aber es scheint, dass vclick nicht tut den trick. Die Veranstaltung ist noch zu feuern und alles, es ist nur, dass die Verzögerung ist nicht Weg..
    InformationsquelleAutor Shamitha Silva
  2. 0

    Haben Sie versucht, die öffnung jQueryMobile-Bibliothek-Datei? Es gibt einige Funktionen wie:

    setTimeout(function() {
    $link.removeClass( $.mobile.activeBtnClass );
    }, 300 );

    Ich bin sicher, dass die Suche in dieser Datei nach "delay" oder "timeout" und ändern es würde ein gutes Ergebnis. Zeile oberhalb von 

    .mobile.popup.handleLink = function( $link ) {
    ...
}
    • Ich habe versucht, ändern der 300 s in der JQM-Datei auf der 13. Ich bekomme keine änderung. (Ich habe dann eine Plausibilitätsprüfung und entfernt eine ganze Zeile aus der JQM-Datei, um sicherzustellen, dass die Datei aufgenommen wird und nicht zwischengespeichert werden oder etwas seltsam und zu entfernen ein ganzes line-in der Tat brechen es.)
    InformationsquelleAutor Piotr Krysiak
  3. 0

    Versuchen Sie die Registrierung TradeDoubler innerhalb der deviceready event-handler:

    document.addEventListener('deviceready', function() {
    FastClick.attach(document.body);
}, false);
    InformationsquelleAutor Mobiletainment
  4. 0

    Haben Sie tryed zu juse dem Tippen Sie auf ein Ereignis?

    $("#test-element").off('tap').on('tap', function(event) {...do your stuff});

    Beachten Sie, dass .binden ist veraltet - besser verwenden on /off

    Beachten Sie, dass je nachdem, wo du bist Befestigung der Event-Handler der Event-Handler bekommen könnte gebunden mehrmals auf pagechange und überdenken.

    Ihnen am besten binden Sie Ihre tap-event-handler in ther pageinit-Ereignis, um sicherzustellen, dass Sie die Befestigung an der Veranstaltung nur einmal und nicht jedes mal, wenn Sie überdenken, eine bestimmte Seite.

    Falls Sie befestigen auf pageshow verwenden Sie die "off" (siehe oben)

    InformationsquelleAutor TorchMan
  5. 0

    Ich hatte das gleiche problem mit einiger Menü-Knöpfe. Meine Lösung funktioniert für alle Plattformen, ohne eine helper-Bibliothek, aber ich wünschte, es gäbe einen besseren Weg, wie das setzen von JQM variable:

    $('#button').unbind('touchstart click').bind('touchstart click', function(event) {
    $('#button').addClass('ui-btn-active');
    //doSomethingHere();
    setTimeout(function() {
        $('#button').removeClass('ui-btn-active');
    }, 300); //this 300ms is just the delay for styling the button
    event.preventDefault(); //if touchstart is supported, do not let the event propagate to the click handler.  Having this here avoids a double trigger.
});

    Der Schlüssel ist die Bindung an touchstart, die sofort ausgelöst.

    HINWEIS - ich habe diesen code in eine pageshow-handler, die ist, warum ich lösen und dann binden Sie es. Sonst würden Sie am Ende mit dem gleichen Ereignis gebunden mehrmals als Benutzer navigiert zu und von dieser Seite aus.

    • Ja, aber ist das denn funktionieren, wenn ich wollen in der Lage sein, um einen Bildlauf auf der Seite?
    • Ja, dies hat keine Auswirkungen auf das scrollen in keiner Weise. Dies ist nur das abfangen und die Behandlung der Klick-Ereignisse.
    • Ok, also ist es nicht das problem lösen. Aber ich bin davon überzeugt, dass das problem liegt nicht in den click-handler. Mit vielen der vorgeschlagenen Lösungen, Wenn ich das anfügen einer Konsole.log-Anweisung aus, um den click-handler, dann kann ich sehen, dass die Schaltfläche ist ziemlich Ansprechend. Aber immer wenn ich versuche zu nennen, einen pageChange dann dauert es 300ms. Also ich bin ziemlich sicher, dass etwas in der pagechange ist das hinzufügen der 300ms wieder in oder Zuschrauben der TradeDoubler.
    InformationsquelleAutor Dave
  6. 0

    Es gibt die Dauer im Zusammenhang mit der Seite übergangsanimationen in JQM. Hier ist das CSS für die Standard - "fade" - übergang (von jquery.mobile.Struktur.css v1.4.2):

    .fade.out {
  opacity: 0;
  -webkit-animation-duration: 125ms;
  -webkit-animation-name: fadeout;
  -moz-animation-duration: 125ms;
  -moz-animation-name: fadeout;
  animation-duration: 125ms;
  animation-name: fadeout;
}
.fade.in {
  opacity: 1;
  -webkit-animation-duration: 225ms;
  -webkit-animation-name: fadein;
  -moz-animation-duration: 225ms;
  -moz-animation-name: fadein;
  animation-duration: 225ms;
  animation-name: fadein;
}

    JQM änderungen der Klassen auf die Seiten, wenn übergänge beginnen und abgeschlossen, so dass im Fall der "fade" - übergang, die Seite gewechselt zu werden, die aktive Seite 225ms nach der Seite abgeschlossen hat, fading out (125ms), d.h. nach 350ms.

    Könnten Sie versuchen, deaktivieren Sie den übergang durch die Angabe {transition: 'none'} in Ihrem Aufruf $.mobile.pageContainer.pagecontainer('change' oder durch Einstellung $.mobile.defaultPageTransition = "none"; in Ihrem mobileinit event-handler, die Sie beherrschen, als die Ursache der Verzögerung.

    Habe ich immer deaktiviert, Seite übergänge in mein Phonegap JQM apps wegen der schlechten performance und flackern (Android), aber ich habe immer noch die Reaktionsfähigkeit Fragen, vor allem auf Android. Ich denke, es ist, wie die webview priorisiert Rendern des DOM. Ich habe festgestellt, dass ein strategisch positioniert setTimeout machen kann, ändert sich die Seite scheint mehr reagieren, indem Sie die "Webansicht" aus, zu verschieben meine Anwendungslogik, bis, nachdem es gerendert wurde, den DOM.

    InformationsquelleAutor wedgberto
Schreibe einen Kommentar