【Web前端问题】如何验证是否触发了触发了beforeunload事件?

<!doctype html>
<html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    <style>
        #div1 {
            width: 200px; 
            height: 200px; 
            background: red;
        }
    </style>
    </head>
    <body>
        <a href = "javascript: ;" onClick = "a()" >链接1</a>
        <a href = "javascript: a();" onClick = "a();return false;">链接2</a>
        <a href = "javascript: a();" >链接3</a>
        <input type = "button" value = "1" onClick = "a()">
        <div id = "div1"></div>
        <script>
            function a() {
                console.log(1);
                var odiv = document.getElementById('div1')
                if(odiv.style.display == 'none'){
                   odiv.style.display = 'block'
                }
                else{
                    odiv.style.display = 'none'
                }
            }
        </script>
    </body>
</html>

本来问题是为什么在chrome和IE环境下快速点击链接3时会停止a()事件执行(firefox正常),后来看到这个图片描述

然后我想验证究竟是不是触发了beforeunload可是不知道该怎么做.(js初学者)。 要是验证是否触发click我还可以在function里打印数字1，可是验证beforeunload是否触发实在想不到思路。如果我给beforeunload添加个事件 那就成了我自己要触发beforeunload事件不能证明是js触发的

回答：

MDN里有说，你可以参考下。

被楼下启发了下，既然标准都不推荐那安全起见还是不推荐这么写的；但如果一定要这么写的话，通常href空链接有两种写法：

  1. href = "#"，onclick = "clickThis.call(this)"，然后记得clickThis里要return false;；

  2. href = "javascript: void(0)"，然后可以随便用js处理下就好。

回答：

其实关于在 href 使用 JavaScript 本身就是一个错误的行为，我想是开发人员在使用 a 标签时，如果不加上 href 或 name 属性的时候，是无法呈现出链接样式效果。

但是如果写一个 # 的话，又会让页面跳转至顶部。

所以，聪明的开发人员就使用的 href="javascript:;" 这种做法，让 a 标签是一个真正有效的链接，同时又防止页面跳至顶部。

然，又有一些聪明的开发人员太懒，觉得反正已经变异写法，不如连 onclick 也不要写，直接写上 href="javascript: return fn();"。

以上，是我编写的历史。

那么回过头来看，在 href 里面写上javascript其实就是相当于在当前页面的地址栏上输入脚本一样。因此，可以简单的解释，为什么在快速点击链接3时，会看起来像是延迟了一些时间。

当然，不管怎么样，在一个本身就是错误的行为上，寻找正确的答应就是愚者的。

以上是 【Web前端问题】如何验证是否触发了触发了beforeunload事件? 的全部内容， 来源链接： utcz.com/a/141081.html

回到顶部