Zdarzenia strony jQuery Mobile

Zdarzenia strony jQuery Mobile

Wydarzenia związane z pracą z stroną w jQuery Mobile są dzielone na cztery kategorie:

  • Inicjalizacja strony - przed utworzeniem strony, w momencie utworzenia strony oraz po inicjalizacji strony
  • Ładowanie/Un载owanie strony - podczas ładowania, wyładowywania zewnętrznej strony lub napotykania błędów
  • Przejście strony - przed i po przejściu strony
  • Zmiana strony - gdy strona jest zmieniana lub napotykane są błędy

Dla pełnych informacji o wszystkich wydarzeniach jQuery Mobile, odwiedź naszą Podręcznik Wydarzeń jQuery Mobile.

Wydarzenie Inicjalizacji jQuery Mobile

Gdy typowa strona w jQuery Mobile jest inicjalizowana, przechodzi przez trzy etapy:

  • Przed utworzeniem strony
  • Utworzenie strony
  • Inicjalizacja strony

Wydarzenia wywoływane w każdym etapie mogą być używane do wstawiania lub operacji kodu.

Zdarzenie Opis
pagebeforecreate Wydarzenie wywoływane, gdy strona ma być inicjalizowana, przed rozpoczęciem wzmocnienia strony przez jQuery Mobile.
pagecreate Wydarzenie wywoływane, gdy strona została utworzona, ale przed zakończeniem wzmocnienia.
pageinit Zdarzenie to jest wyzwalane, gdy strona została zainicjalizowana i jQuery Mobile zakończył wzmocnienie strony.

Poniżej znajduje się przykład, kiedy są wyzwalane różne zdarzenia podczas tworzenia strony w jQuery Mobile:

Przykład

$(document).on("pagebeforecreate",function(event){
  alert("Wyzwalono zdarzenie pagebeforecreate!");
}); 
$(document).on("pagecreate",function(event){
  alert("Wyzwalono zdarzenie pagecreate!");
});
$(document).on("pageinit",function(event){
  alert("Wyzwalono zdarzenie pageinit!");
});

Spróbuj sam

Zdarzenia ładowania jQuery Mobile

Zdarzenia ładowania strony należą do zewnętrznych stron.

Niewzależnie od tego, kiedy zewnętrzna strona jest ładowana do DOM, wyzwalane są dwa zdarzenia. Pierwsze to pagebeforeload, drugie to pageload (udane) lub pageloadfailed (nieudane).

Poniżej jest wyjaśnienie tych zdarzeń:

Zdarzenie Opis
pagebeforeload Wyzwalane przed każdym żądaniem ładowania strony.
pageload Wyzwalane po pomyślnym załadowaniu i wstawieniu strony do DOM.
pageloadfailed Jeśli żądanie ładowania strony zakończy się niepowodzeniem, zostanie wyzwolone to zdarzenie. Domyślnie, zostanie wyświetlona wiadomość "Błąd ładowania strony".

Poniżej jest przedstawienie działania zdarzeń pageload i pageloadfailed:

Przykład

$(document).on("pageload",function(event,data){
  alert("Wyzwalono zdarzenie pageload!\nURL: " + data.url);
});
$(document).on("pageloadfailed",function(event,data){
  alert("Przepraszamy, żądana strona nie istnieje.");
});

Spróbuj sam

Zdarzenia przejścia jQuery Mobile

Możemy również używać zdarzeń podczas przejścia z jednej strony do następnej.

Przejścia stron obejmują dwie strony: jedną "przychodzącą" i jedną "odchodzącą" - te przejścia sprawiają, że zmiana bieżącej aktywnej strony (strony "przychodzącej") na nową stronę (stronę "odchodzącą") staje się bardziej dynamiczna.

Zdarzenie Opis
pagebeforeshow Wyzwalane na stronie "odchodzącej", przed rozpoczęciem animacji przejścia.
pageshow Wyzwalane na stronie "odchodzącej", po zakończeniu animacji przejścia.
pagebeforehide Wyzwalane na stronie "przychodzącej", przed rozpoczęciem animacji przejścia.
pagehide Wyzwalane na stronie "przychodzącej", po zakończeniu animacji przejścia.

Poniżej jest przedstawienie działania czasu przejścia:

Przykład

$(document).on("pagebeforeshow","#pagetwo",function(){ // Kiedy wchodzimy na stronę drugą
  alert("Strona druga zostanie wyświetlona");
});
$(document).on("pageshow","#pagetwo",function(){ // Kiedy wchodzimy na stronę drugą
  alert("Strona druga jest teraz widoczna");
});
$(document).on("pagebeforehide","#pagetwo",function(){ // Kiedy opuszczamy stronę drugą
  alert("Strona druga będzie ukryta");
});
$(document).on("pagehide","#pagetwo",function(){ // Kiedy opuszczamy stronę drugą
  alert("Strona druga jest teraz ukryta");
});

Spróbuj sam