js 离开当前页面提示

野性酷女 2022-06-18 00:21 288阅读 0赞

需求 ： 当用户离开html 页面时，希望给用户弹出一个提示，以免丢失用户输入的信息。

实现： 使用了jquery 。 html 代码如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>cookie</title>
    <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
    
    var IsModifyed = false; /*当前页是否触发修改点*/
    function SetBeforeunload(modify) { 
    	IsModifyed = !!modify; 
    	window.onbeforeunload = IsModifyed ? function() { return "你尚未保存，确定离开吗?"; } : null; }
    
    $(function() {
        SetBeforeunload(false);
        /*取消 修改动作*/
        $(".cancelmodifymarks").click(function() {
            SetBeforeunload(false);
        });
        /*修改动作 标记*/
        $(".modifymarks").click(function() {
            SetBeforeunload(true);
        });
    });
    </script>
    </head>
    <body>
    AAA
    <input class="cancelmodifymarks" type="text" value="AAA"/>
    ccc
    <input class="modifymarks" type="text" value="ccc"/>
    
    </body>
    </html>

效果： 点击值为"ccc" 的Input 框，离开本html 页面(如：IE 的刷新，关闭等)，会有提示信息。在点击值为"AAA" 的Input 框，离开页面时，不会有提示信息。

发表评论取消回复

表情：

评论列表（有 0 条评论，288人围观）

还没有评论，来说两句吧...

相关阅读

相关 js实现当前页面关闭功能

页面实现 <div> <input type="button" value="关闭当前页" class="close" onclick="closeWin(

男娘i/ 2023年10月18日 15:08/ 0 赞/ 141 阅读

相关 angular Js监听离开当前页面

使用 AngularJs-destroy事件（页面离开事件）在Controller中监听$destory事件，这个事件会在页面发生跳转的时候触发。 /

末蓝、/ 2023年05月31日 02:55/ 0 赞/ 17 阅读

相关 JS_js关闭当前页面

function closeWindow(){ var userAgent = navigator.userAgent; if (userAgen

旧城等待，/ 2023年01月22日 14:52/ 0 赞/ 18 阅读

相关 vue 中js页面跳转到静态页面_Vue.js当前页面跳转当前页面$route.fullpath

在vue中如何去实现当前页面跳转当前页面，看完这篇文章，相信你的心里会有答案关于当前页面跳转在实际项目中有这个需求，当然，实现方式很多，在这里主要说一个比较优雅的方式，通过绑定

心已赠人/ 2022年10月27日 01:49/ 0 赞/ 229 阅读

相关 js技能提升——关闭当前页面

最近在做后台管理系统时，遇到一个需求，点击某个按钮时，需要重新打开一个浏览器选项卡，然后还可以关闭此选项卡。打开新的浏览器选项卡 `window.open(url,

柔光的暖阳◎/ 2022年08月28日 04:53/ 0 赞/ 227 阅读

相关 js 离开当前页面提示

需求：当用户离开html 页面时，希望给用户弹出一个提示，以免丢失用户输入的信息。实现：使用了jquery 。 html 代码如下。 <!DOCTYP

野性酷女/ 2022年06月18日 00:21/ 0 赞/ 289 阅读

相关 JS实现页面跳转，JS获取当前页面地址

JS有时候需要实现页面跳转，那么可以直接在某个事件触发中设置 location.href="/user/center/" 这样即可实现页面跳转。 \\

- 日理万妓/ 2022年05月27日 01:56/ 0 赞/ 341 阅读

相关 js关闭当前页面

关闭当前页面 function closeWindow(){ var userAgent = navigator.userAgent; if (u

刺骨的言语ヽ痛彻心扉/ 2021年10月13日 21:16/ 0 赞/ 468 阅读

相关 js实现用户关闭页面时提示是否离开此页面的方法

<script type="text/javascript"> window.onbeforeunload = function(){

﹏ヽ暗。殇╰゛Y/ 2021年09月27日 21:14/ 0 赞/ 376 阅读

相关 js离开页面执行函数 onbeforeunload与onunload事件

转自：https://www.cnblogs.com/xianyulaodi/p/5035171.html 仅用于学习在最近的项目中，需要做到一个时间，就是用户

朱雀/ 2021年09月14日 15:26/ 0 赞/ 542 阅读