Ich bin etwas verwirrt über die Verwendung dieser Methoden. Ich weiß, dass pageInit während der Initialisierung aufgerufen wird, aber pageshow wird jedes Mal während des Seitenrenderings aufgerufen.
Ich habe eine Homepage, die Daten mit $ .ajax () für einige Abschnitte lädt. Ich lade die Daten in seitenweise. Binden auch nur die Click- und Swipe-Events in page init. Und, ich habe auch bemerkt, dass die Seite nicht aufgerufen wird, wenn Sie von einer anderen Seite zurückkommen.
Hatte noch ein Problem, wo wir ein Karussell mit swipe.js verwenden. Es wird nicht ordnungsgemäß geladen, wenn die pageInit-Methode verwendet wird. Aber, funktioniert gut beim Laden in Pageshow-Methode. Was könnte der Grund dafür sein, dass ein Seitenaufruf aufgerufen wird, wenn wir den Zurück-Knopf des Browsers benutzen?
Auch spielt die Caching-Rolle eine Rolle bei der Entscheidung, wo die Logik des Ladens von Daten, Bindungsereignissen usw. zu platzieren ist. Es wäre am besten, wenn jemand das Laden von Homepage-Daten erklären, dann navigieren und von einer anderen Seite zurückkehren kann .
Alle hier gefundenen Informationen finden Sie auch in meinem Blog ARTIKEL finden Sie auch Arbeitsbeispiele.
Lasst uns von Anfang an beginnen. Wie Sie bereits wissen, haben jQuery-Entwickler uns mit Seitenereignissen versehen, um eine Lücke zu überbrücken, die das Dokument nicht erfüllen kann. Während document ready Ihnen sagen kann, dass Inhalte in einem DOM bereit sind, brauchen wir mehr als das, weil jQuery Mobile immer noch die Inhaltsmarkierung verbessern muss (den Inhaltsstil verbessern).
Es gibt mehrere Seitenereignisse, und jeder von ihnen hat seinen Zweck. Einige werden ausgelöst, bevor der Seiteninhalt verbessert werden kann (wie pagebeforecreate ), damit dynamischer Inhalt hinzugefügt werden kann . Einige werden nur beim Seitenwechsel wie pagebeforechange ausgelöst.
Aber lassen Sie uns auf Ihre Frage zurückkommen. Pageinit ist eine jQuery Mobile-Version von document ready . Während Sie immer noch document ready verwenden können, ist es immer noch logisch, die gleiche Alternative zwischen Seitenereignissen zu haben.
Wie Sie bereits gesagt haben, verwenden Sie pageinit für die Ereignisbindung (wie Klick- oder Swipe-Ereignisse), und das ist eine gute Lösung. Hauptsächlich weil jQuery Mobile an einem Problem namens "multiple event binding" leidet. Wenn z.B. Wenn Sie eine Click-Ereignisbindung an ein Element haben, kann nichts verhindern, dass ein anderes Klickereignis an dasselbe Element gebunden wird. Und das passiert, wenn Sie das Ereignis pageshow verwenden. Wenn Sie die Ereignisbindung während des pageshow -Ereignisses verwenden, wird jedes Mal, wenn eine Seite besucht wird, das gleiche Ereignis immer wieder gebunden. Es kann leicht verhindert werden, aber die gleiche Vorbeugung erfordert zusätzliche Rechenleistung des Prozessors, dieselbe Leistung, die für den Rest der Web-App verwendet werden kann.
Hier haben wir eine andere Frage (eine Ihrer Fragen), was ist dann der Zweck von pageshow ? Offensichtliche Antwort wäre etwas mit einer verfügbaren und angezeigten Seite zu tun. Während der richtigen Antwort ist es nicht so wichtig. Pageshow ist wichtig, da es nur ein Seitenereignis ist, bei dem die Seitenhöhe korrekt berechnet werden kann und es nicht 0 ist. Jetzt können Sie sehen, warum Ihr Karussell an diesem Punkt initialisiert werden muss. Für Karussells wie viele andere Plugins (Diagramme, Bildergalerien) ist eine korrekte Seitenhöhe erforderlich. Wenn Sie sie vor pageshow initialisieren, haben sie die Höhe 0, sie sind also vorhanden, aber Sie können sie nicht sehen .
Bezüglich Ihrer letzten Frage. Einzahlungen spielen keine Rolle, wenn Ihre Anwendung korrekt erstellt wird. Zu Beginn sollten Sie immer die delegierte Ereignisbindung verwenden, da es nicht wichtig ist, ob ein Seitenelement existiert oder nicht. Grundsätzlich, wenn Sie Ihr Ereignis an ein übergeordnetes Element wie ein Dokument binden, spielt es keine Rolle, ob Ihre Seite eingelöst oder aus dem DOM entfernt wird. Sobald es zurück ist, wird das gleiche Ereignis wieder funktionieren.
Beispiel:
%Vor% Diese Methode bindet ein Klickereignis an ein Dokument, aber das gleiche Klickereignis funktioniert nur bei einem Element mit der ID ' some-button' . Es spielt keine Rolle, ob dieses Element existiert oder nicht, weil das Dokumentobjekt immer existiert.
Dieselbe Logik ist nicht so wichtig, wenn Sie mit normalen Webseiten arbeiten, wo das Reload von Seiten eine häufige Sache ist. Oder auch hier mit jQuery Mobile, wenn Ajax ausgeschaltet ist, so ist jede Seitenänderung im Grunde Seitenaktualisierung / Neuladen.
Ich hoffe, das beantwortet alle Ihre Fragen. Wenn Sie Erläuterungen benötigen, fragen Sie sie im Kommentarbereich.
BEARBEITEN:
Wo sollten Sie Ihre Daten laden, hängt davon ab, was Sie laden müssen. Wenn Sie das nur einmal tun möchten, verwenden Sie pageinit . Wenn Sie es jedes Mal benötigen, wenn Sie die Seite besuchen, verwenden Sie pagebeforeshow (denn wenn Sie pageshow verwenden, wird der Inhalt einfach aus dem Nichts angezeigt und es kann den Benutzer). Verwenden Sie nicht pagebeforecreate , da der Inhalt nach dem Ende des Ereignisses geladen wird. Daher ist es nicht sinnvoll, ihn zu verwenden.
Wenn Sie Inhalt in einem Intervall laden möchten, verwenden Sie pageinit mit der Funktion setinterval. Vergiss nicht Seiteninhaltstile jedes Mal manuell zu ergänzen, wenn dynamischer Inhalt hinzugefügt wird.
Pageshow ist nur nützlich, wenn die Initialisierung der Plug-Ins die erforderliche Seitenhöhe erfordert. Sonst nichts Besonderes. Aus Antwort 1 kann man sehen, dass es ein Bett für dynamischen Inhalt ist, weil es aus dem Nichts auftauchen wird.
Pageinit sollte für die Ereignisbindung und dynamische Inhaltsgenerierung verwendet werden.
Morgen werde ich meine Antwort mit Anwendungsfällen für jedes Seitenereignis aktualisieren . Ich hoffe, das wird dir genug sein.
Tags und Links javascript cordova jquery jquery-mobile jquery-mobile-pageshow