Mengapa Skrip Mesti Disertakan dalam Index.html Apabila Menggunakan jQuery Mobile
Pengenalan
Dalam projek jQuery Mobile, mengubah hala halaman menggunakan $.mobile.changepage() menimbulkan kekeliruan. Pembangun mesti memasukkan semua skrip halaman dalam fail yang sama, index.html, atau halaman ubah hala akan gagal untuk melaksanakan fungsi yang ditakrifkan dalam pengepalanya. Artikel ini menerangkan tingkah laku di sebalik fenomena ini.
Cara jQuery Mobile Mengendalikan Perubahan Halaman
jQuery Mobile menggunakan Ajax untuk memuatkan halaman berikutnya. Walaupun halaman pertama dimuatkan seperti biasa, halaman berikutnya hanya memuatkan kandungan badannya. Khususnya, hanya div pertama dengan atribut data-role="page" yang digabungkan ke dalam DOM, membuang apa-apa lagi.
Sebab Ketidakupayaan Skrip
Dalam anda halaman kedua, dan halaman seterusnya, butang kelihatan kerana HTML dipaparkan secara normal. Walau bagaimanapun, acara klik gagal berfungsi kerana kepala induknya diabaikan semasa peralihan halaman.
Penyelesaian 1: Mengalihkan Skrip ke dalam Kandungan Badan
Penyelesaian pantas ialah mengalihkan tag skrip ke dalam kandungan kandungan halaman berikutnya:
<body> <div data-role="page"> // HTML content <script> // JavaScript </script> </div> </body>
Penyelesaian 2: Menyatukan Skrip dalam Index.html
Penyelesaian pilihan ialah memindahkan semua JavaScript ke dalam satu fail, index.js, diletakkan di kepala fail HTML pertama:
<head> <meta ...> <link rel="stylesheet" ...> <script src="jquery.mobile-1.2.0.min.js"></script> <script src="index.js"></script> // Your consolidated JavaScript </head>
Sebab untuk Penggabungan Index.html
Jurang telefon, seperti jQuery Mobile, boleh mempamerkan pepijat. Jika semua JavaScript diletakkan dalam satu fail HTML, ralat boleh timbul dan memuat semula halaman semasa. Jika halaman itu kekurangan JavaScript yang diperlukan, ia tidak akan berfungsi lagi sehingga dimulakan semula.
Penyelesaian Realistik
Alihkan fail index.js ke dalam kepala semua fail HTML yang lain . Ini memastikan skrip boleh diakses walaupun elemen DOM lain hilang disebabkan pepijat.
Kesimpulan
Memahami cara jQuery Mobile mengendalikan perubahan halaman adalah penting untuk pembangunan apl yang berjaya. Menggabungkan skrip dalam index.html ialah penyelesaian yang disyorkan untuk memastikan ketersediaan skrip dan mencegah potensi isu dengan Phonegap.
Atas ialah kandungan terperinci Mengapa Skrip Halaman Mudah Alih jQuery Perlu Disertakan dalam `index.html`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!