Bagaimana cara mencegah halaman web menavigasi menggunakan JavaScript?
javascript
onbeforeunload
Antusiasme Perangkat Lunak
sumber
sumber
Jawaban:
Menggunakan
onunload
memungkinkan Anda untuk menampilkan pesan, tetapi tidak akan mengganggu navigasi (karena sudah terlambat). Namun, menggunakanonbeforeunload
akan mengganggu navigasi:Catatan: String kosong dikembalikan karena browser yang lebih baru memberikan pesan seperti "Perubahan yang tidak disimpan akan hilang" yang tidak dapat diganti.
Di browser yang lebih lama Anda bisa menentukan pesan yang akan ditampilkan di prompt:
sumber
window.onbeforeunload = function() { return ""; }
Tidak seperti metode lain yang disajikan di sini, sedikit kode ini tidak akan menyebabkan browser menampilkan peringatan yang menanyakan kepada pengguna apakah ia ingin pergi; sebaliknya, ia mengeksploitasi sifat DOM yang terjadi untuk mengarahkan kembali ke halaman saat ini (dan dengan demikian membatalkan navigasi) sebelum browser memiliki kesempatan untuk menurunkannya dari memori.
Karena ia bekerja dengan navigasi hubungan arus pendek secara langsung, itu tidak dapat digunakan untuk mencegah halaman ditutup; namun, ini dapat digunakan untuk menonaktifkan frame-busting.
Penafian: Anda seharusnya tidak pernah melakukan ini. Jika suatu halaman memiliki kode penghilang bingkai, harap hormati keinginan penulis.
sumber
Saya berakhir dengan versi yang sedikit berbeda ini:
Di tempat lain saya mengatur flag kotor ke true ketika formulir menjadi kotor (atau saya ingin mencegah navigasi pergi). Ini memungkinkan saya untuk dengan mudah mengontrol apakah pengguna mendapat konfirmasi Konfirmasi Navigasi atau tidak.
Dengan teks di jawaban yang dipilih Anda melihat permintaan berlebihan:
sumber
undefined
Setara dengan cara yang lebih modern dan kompatibel dengan browser, menggunakan API addEventListener modern.
Sumber: https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload
sumber
event.returnValue
Dalam contoh Ayman dengan mengembalikan false Anda mencegah jendela / tab browser tertutup.
sumber
Setara dengan jawaban yang diterima di jQuery 1.11:
Contoh JSFiddle
Jawaban altCognito menggunakan
unload
acara tersebut, yang terlambat bagi JavaScript untuk membatalkan navigasi.sumber
Gunakan onunload .
Untuk jQuery, saya pikir ini berfungsi seperti ini:
sumber
unload
peristiwa ini terjadi ketika pengguna meninggalkan halaman, tidak sepertibeforeunload
yang terjadi sebelumnya (dan mungkin dibatalkan)Pesan kesalahan yang disarankan dapat menduplikasi pesan kesalahan yang sudah ditampilkan browser. Di chrome, 2 pesan kesalahan serupa ditampilkan satu demi satu di jendela yang sama.
Di chrome, teks yang ditampilkan setelah pesan khusus adalah: "Apakah Anda yakin ingin meninggalkan halaman ini?". Di firefox, sama sekali tidak menampilkan pesan kesalahan khusus kami (tetapi masih menampilkan dialog).
Pesan kesalahan yang lebih tepat mungkin:
Atau gaya stackoverflow: "Anda sudah mulai menulis atau mengedit posting."
sumber
Jika Anda menangkap tombol maju / mundur browser dan tidak ingin bernavigasi, Anda dapat menggunakan:
Jika tidak, Anda dapat menggunakan acara sebelumunload , tetapi pesannya mungkin atau mungkin tidak bekerja lintas browser, dan membutuhkan kembali sesuatu yang memaksa prompt built-in.
sumber