Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Mencegah Navigasi Tidak Sengaja dari Halaman dengan Perubahan Tidak Disimpan?

Bagaimana untuk Mencegah Navigasi Tidak Sengaja dari Halaman dengan Perubahan Tidak Disimpan?

Susan Sarandon
Lepaskan: 2024-12-12 14:20:10
asal
910 orang telah melayarinya

How to Prevent Accidental Navigation Away from a Page with Unsaved Changes?

Cara Memaparkan "Adakah anda pasti mahu menavigasi keluar dari halaman ini?" Apabila Perubahan Dilakukan

Dalam persekitaran web moden, memaparkan gesaan navigasi tersuai dianggap sebagai kebimbangan keselamatan dan penyemak imbas tidak lagi menyokong fungsi ini. Sebaliknya, penyemak imbas hanya akan memaparkan mesej generik. Untuk mendayakan atau melumpuhkan gesaan navigasi, hanya gunakan kod berikut:

// Enable navigation prompt
window.onbeforeunload = function() {
    return true;
};

// Remove navigation prompt
window.onbeforeunload = null;
Salin selepas log masuk

Sokongan Penyemak Imbas Lama (Ditamatkan)

Untuk keserasian dengan penyemak imbas lama seperti sebagai IE6-8 dan Firefox 1-3.5, anda boleh menggunakan kod berikut untuk memaparkan navigasi tersuai prompt:

var confirmOnPageExit = function (e) {
    // Define the message to be displayed
    var message = 'Confirm your navigation away from the page';

    // Handle compatibility with older browsers
    if (e) {
        e.returnValue = message;
    }

    // Return the message
    return message;
};

// Enable the navigation prompt
window.onbeforeunload = confirmOnPageExit;

// Disable the navigation prompt
window.onbeforeunload = null;
Salin selepas log masuk

Untuk menyemak nilai yang diubah apabila menggunakan rangka kerja pengesahan seperti jQuery, anda boleh menggunakan kod yang serupa dengan yang berikut:

$('input').change(function() {
    // Check if the input value is not empty
    if( $(this).val() != "" ) {
        // Enable the navigation prompt
        window.onbeforeunload = confirmOnPageExit;
    }
});
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Navigasi Tidak Sengaja dari Halaman dengan Perubahan Tidak Disimpan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan