Acara jQuery Mobile Halaman
Acara untuk menangani halaman dalam jQuery Mobile dibagi menjadi empat kategori:
- Halaman Inisialisasi - Sebelum penciptaan halaman, dan saat halaman telah dibuat
- Halaman Load / Unload - Ketika sebuah halaman eksternal memuat, muat atau pertemuan gagal
- Halaman Transisi - Sebelum dan sesudah halaman transisi
- Halaman Ganti - Ketika halaman diubah ke atau dari, atau pertemuan kegagalan
Untuk referensi lengkap semua peristiwa jQuery Mobile, silakan kunjungi kami jQuery Mobile Acara Referensi .
jQuery Mobile Inisialisasi Acara
Ketika sebuah halaman yang khas di jQuery Mobile diinisialisasi, ia pergi melalui dua tahap:
- Sebelum penciptaan halaman
- penciptaan halaman
Setiap tahap memiliki suatu peristiwa yang dapat digunakan untuk memasukkan atau memanipulasi kode sebelum atau ketika jQuery Mobile meningkatkan halaman.
| Peristiwa | Deskripsi |
|---|---|
| pagebeforecreate | Dipicu ketika halaman sekitar diinisialisasi, dan sebelum jQuery Mobile telah mulai meningkatkan halaman |
| pagecreate | Dipicu ketika halaman telah dibuat, tapi sebelum peningkatan selesai |
Contoh di bawah ini menunjukkan bila setiap peristiwa kebakaran saat halaman dibuat di jQuery Mobile:
Contoh
$(document).on("pagebeforecreate",function(event){
alert("pagebeforecreate event fired!");
});
$(document).on("pagecreate",function(event){
alert("pagecreate event fired!");
}); Cobalah sendiri " jQuery Mobile Beban Acara
Peristiwa buka halaman yang untuk halaman eksternal.
Setiap kali halaman eksternal dimuat ke dalam DOM, 2 peristiwa kebakaran. Yang pertama adalah pagecontainerbeforeload, dan yang kedua akan baik pagecontainerload (sukses) atau pagecontainerloadfailed (gagal).
Peristiwa ini dijelaskan dalam tabel di bawah:
| Peristiwa | Deskripsi |
|---|---|
| pagecontainerbeforeload | Dipicu sebelum permintaan buka halaman dibuat |
| pagecontainerload | Dipicu setelah halaman telah berhasil dimuat dan dimasukkan ke dalam DOM |
| pagecontainerloadfailed | Dipicu jika permintaan buka halaman gagal. Secara default, ia akan menampilkan "Error Loading Halaman" pesan |
Contoh di bawah ini menunjukkan bagaimana pagecontainerload dan acara pagecontainerloadfailed bekerja:
Contoh
$(document).on("pagecontainerload",function(event,data){
alert("pageload
event fired!\nURL: " + data.url);
});
$(document).on("pagecontainerloadfailed",function(event,data){
alert("Sorry, requested page does not exist.");
}); Cobalah sendiri " jQuery Mobile Transition Acara
Kita juga bisa menggunakan acara untuk ketika kita transisi dari satu halaman ke halaman berikutnya.
Halaman transisi melibatkan dua halaman: a "dari" halaman dan "untuk" halaman - transisi ini menghidupkan perubahan dari halaman aktif saat ini (fromPage) ke halaman baru (toPage) .
| Peristiwa | Deskripsi |
|---|---|
| pagebeforeshow | Dipicu pada "ke" halaman, sebelum animasi transisi dimulai |
| pageshow | Dipicu pada "ke" halaman, setelah animasi transisi selesai |
| pagebeforehide | Dipicu pada halaman "dari", sebelum mulai transisi animasi |
| pagehide | Dipicu pada halaman "dari", setelah animasi transisi selesai |
Contoh di bawah ini menunjukkan bagaimana peristiwa transisi bekerja:
Contoh
$(document).on("pagebeforeshow","#pagetwo",function(){ // When entering
pagetwo
alert("pagetwo is about to be shown");
});
$(document).on("pageshow","#pagetwo",function(){
// When entering pagetwo
alert("pagetwo is now shown");
});
$(document).on("pagebeforehide","#pagetwo",function(){
// When leaving pagetwo
alert("pagetwo is about to be hidden");
});
$(document).on("pagehide","#pagetwo",function(){
// When leaving pagetwo
alert("pagetwo is now hidden");
}); Cobalah sendiri "