猿问

如何阻止页面在JS中卸载(导航)?

有人知道如何阻止页面重新加载或导航吗?


jQuery(函数($){


    / *全局卸载通知* /

    警告=真;


    如果(警告){

        $(window).bind(“ unload”,function(){ 

            如果(confirm(“是否要离开此页面”)== true){

                //他们按了确定

                警报('确定');

            }其他{

                //他们按下了取消

                警报('取消');

                返回false;

            }

        });

    }

});

目前,我正在一家电子商务网站上工作,显示您将来的订单的页面可以更改使用+/-按钮订购的项目的数量。以这种方式更改数量实际上并不会更改订单本身,他们必须按下确认键,因此会采取积极行动更改订单。


但是,如果他们更改了数量并离开了页面,我想警告他们,以防万一,这是偶然的,因为如果更改数量或离开页面或刷新页面,更改的数量将会丢失。


在上面的代码中,我使用的是全局变量,默认情况下将为false(仅用于测试),更改数量时,我会将其更新为true,当他们确认更改时,会将其设置为false 。


如果警告是正确的并且该页面已被卸载,那么我会向他们提供一个确认框,如果他们说不,他们希望停留在该页面上,则需要停止该页面的卸载。return false不起作用,它仍然允许用户导航(警报仅在调试时使用)


有任何想法吗?


慕无忌1623718
浏览 632回答 3
3回答

Cats萌萌

onbeforeunload是你想要的那个 您的函数“应将字符串值分配给Event对象的returnValue属性并返回相同的字符串”。查看Microsoft和Mozilla的文档以了解详细信息。浏览器将使用您返回的字符串为用户提供一个自定义确认框,从而允许他们拒绝选择停留在那的用户。必须采取这种方式来防止恶意脚本引起“浏览器拒绝”攻击。

侃侃无极

此代码按照Natalie的建议发出警告,但如果提交了页面上的表单,则会禁用警告。使用JQuery。var warning = true;window.onbeforeunload = function() {   if (warning) {    return "You have made changes on this page that you have not yet confirmed. If you navigate away from this page you will lose your unsaved changes";  }}$('form').submit(function() {   window.onbeforeunload = null;});

catspeake

window.onbeforeunload = function() {   if (warning) {    return 'You have made changes on this page that you have not yet confirmed.     If you navigate away from this page you will loose your unsaved changes';  }}Chrome,Safari和Opera不支持
随时随地看视频慕课网APP
我要回答