jQuery Mudah Alih: Dokumen Sedia atau Acara Halaman: Mana Yang Lebih Baik untuk Mengendalikan Pemuatan Halaman?

jQuery Mobile: Document Ready vs Page Events

Memahami Perbezaan

Dalam jQuery Mobile, terdapat dua cara utama untuk melaksanakan kod apabila halaman dimuatkan:

1. Dokumen Sedia ($(document).ready()): Acara ini dicetuskan apabila DOM dimuatkan dan semua elemen tersedia. Walau bagaimanapun, dalam jQuery Mobile, acara ini kadangkala boleh dilaksanakan terlalu awal, sebelum halaman dimuatkan dan dimanipulasi menggunakan Ajax.
2. Peristiwa Halaman ($('.selector').on('pageinit/pagebeforeshow' )): Acara ini direka khusus untuk jQuery Mobile dan dicetuskan apabila halaman dimulakan atau sebelum ia dipaparkan. Mereka memastikan bahawa kod dilaksanakan hanya apabila halaman tertentu dimuatkan.

Mengapa acara halaman lebih baik:

• Mereka memastikan kod itu dilaksanakan hanya apabila halaman yang dimaksudkan dimuatkan dan kelihatan.
• Ia menyediakan cara yang lebih mudah diramal dan konsisten untuk mengendalikan halaman acara.

Tertib Peralihan Acara Halaman

Apabila beralih dari satu halaman ke halaman lain dalam jQuery Mobile, urutan acara halaman dicetuskan dalam susunan berikut:

1. Halaman B: pagebeforecreate
2. Halaman B: pagecreate
3. Halaman B: pageinit
4. Halaman A: pagebeforehide
5. Halaman A: pageremove
6. Halaman A: pagehide
7. Halaman B: pagebeforeshow
8. Halaman B: pageshow

Manipulasi Data dan Hantaran Parameter

Menghantar data dari satu halaman ke halaman yang lain:

• Gunakan $.mobile.changePage () dengan pilihan data dan dataUrl untuk menghantar parameter ke halaman baharu.
• Dalam halaman destinasi, dapatkan semula parameter menggunakan $(document).data() atau $(document).data("url") untuk mendapatkan rentetan pertanyaan.

Mengakses data dari halaman sebelumnya:

• Simpan data dalam pembolehubah global atau gunakan objek sessionStorage.
• Dapatkan semula data daripada lokasi kongsi pada halaman baharu.

Mencegah Pengikatan Berbilang Peristiwa

Untuk menghalang pengikatan berbilang acara pada elemen yang sama apabila menavigasi antara halaman:

• Gunakan acara halaman dan bukannya dokumen sedia.
• Gunakan penapis acara (cth., :Acara(!klik)) untuk memastikan acara terikat sekali sahaja.
• Gunakan e.handled = true dalam pengendali acara untuk mengelakkan pencetus semula.

Atas ialah kandungan terperinci jQuery Mudah Alih: Dokumen Sedia atau Acara Halaman: Mana Yang Lebih Baik untuk Mengendalikan Pemuatan Halaman?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!