zoukankan      html  css  js  c++  java
  • window.onbeforeunload方法在IE下无法正常工作的解决办法

    事件的起因是由于在工作中有客户反映,常常会有用户在浏览网页的过程中订购了商品,但是由于用户一下子打开的窗口过多,又或者在敲打键盘时,错误地按到了F5键,导致页面刷新或者不正常关闭,而这时在该网页上所做的一切操作的信息都丢失了,如果我们可以提供一个在客户信息未处理完成时的提示那该多好啊,下面的代码可以做到不管用户是点击了关闭,或者是在任务栏关闭、点击后退、刷新、按F5键,都可以检测到用户即将离开的消息。

    <script type="text/javascript" language="javascript">
    function bindunbeforunload()
    {
    window.onbeforeunload
    =perforresult;
    }
    function unbindunbeforunload()
    {
    window.onbeforeunload
    =null;
    }
    function perforresult()
    {
    return"当前操作未保存,如果你此时离开,所做操作信息将全部丢失,是否离开?";
    }
    </script>


    只需要将bindunbeforunload()方法注册到要检测的页面上即可,你可以在body的onload或者document.ready中注册这个方法,在这里我们采用的是window.onbeforeunload,即是在页面即将卸载之前弹出提示框,好的,现在来测试一下,测试代码:

    <html>
    <head><title>this is id onbeforunload event test</title>
    </head>
    <script type="text/javascript" language="javascript">
    function bindunbeforunload()
    {
    window.onbeforeunload
    =perforresult;
    }
    function unbindunbeforunload()
    {
    window.onbeforeunload
    =null;
    }
    function perforresult()
    {
    return"当前操作未保存,如果你此时离开,所做操作信息将全部丢失,是否离开?";
    }
    </script>
    <body onload="javascript:return bindunbeforunload();">
    <h1>test is start</h1>
    <input type="button" value="绑定事件" id="btnBind" onclick="return biindunbeforunload();"/>
    <input type="button" value="删除绑定事件" id="btnUnBind" onclick="unbiindunbeforunload();"/>
    </body>
    </html>

    上面的代码就是我此次测试的所有代码了,现在刷新页面,嗯,很好,弹出了我们期望中的对话框。但是当我在IE下打开上述代码时,我的“删除事件绑定按钮”没有发挥作用,这让我很崩溃,国内3分之2的用户都在使用IE,特别是在使用该死的IE6、7,如果我的代码不能在IE6、7下正常的工作,那相当于我的工作是白做了,当然,奖金的那些事情就更不用想了。办法都是人想出来的,好吧,我利用一个全局变量来控制是否弹出对话框,修改后的"javascript"代码如下:

    <script type="text/javascript" language="javascript">
    var goodexit=false;
    function bindunbeforunload()
    {
    goodexit
    =false;
    window.onbeforeunload
    =perforresult;
    }
    function unbindunbeforunload()
    {
    goodexit
    =true;
    window.onbeforeunload
    =null;
    }
    function perforresult()
    {
    if(!goodexit)
    {
    return"当前操作未保存,如果你此时离开,所做操作信息将全部丢失,是否离开?";
    }
    }
    </script>

    同时调用删除绑定事件时,将变量goodexit的值更改为:true,表示用户是正常退出,这样自然不会弹出对话框了。

    再测试一下,正常了,对,这就是我想要的结果!

    本篇文章源于从Brandon Himes处而得,并且还是从google快照,源文链接已找不到,本来想翻译的,但是本人水平实在有限,看得懂而已,如果翻译得不好反而招骂,如果朋友们想看源文,请直接点击这里,这是快照地址,可能一段时间后就不存在了。

    源文链接:

    http://203.208.39.132/search?q=cache:-PgDk6V5RO0J:bustedmug.blogspot.com/2007/01/onbeforeunload-ie7-assigning-event.html+window.onbeforeunload%3Dnull&cd=1&hl=zh-CN&ct=clnk&gl=cn&st_usg=ALhdy28uwFnho9K-2RHeu_13vmcvOxoJPg
     

  • 相关阅读:
    Matlab Tricks(二十九) —— 使用 deal 将多个输入赋值给多个输出
    释名 —— 名称的含义、来源
    Eclipse快捷键 今天又学会了几个不常用的 收藏了
    HDU 2527
    UVAlive 2326 Moving Tables(贪心 + 区间问题)
    STM32关于优先级设定的理解 NVIC_SetPriority()
    linux6.2安装mysql
    【PAT】1009. Product of Polynomials (25)
    Android的重力传感器(3轴加速度传感器)简单实例
    out/target/common/obj/PACKAGING/public_api.txt android.view.KeyEvent.KEYCODE_has changed value from
  • 原文地址:https://www.cnblogs.com/viter/p/1654690.html
Copyright © 2011-2022 走看看