如何监听弹出对话框的关闭事件

Posted 2023-04-30

参考技术A 方式一：(适用于IE浏览器，而且刷新不提示，只在点击浏览器关闭按钮的时候提示)
方式二：适用于IE和FF，不区分刷新和关闭 参考技术B 下面的代码兼容除 Opera 之外的任何浏览器。Opera 到现在最高版本为止对 onunload 的支持都是不完整的，对于 unbeforeunload 更是根本不支持。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<script type="text/javascript">
window.onbeforeunload = function(e)
e = e || window.event;
var msg = "您确定要离开此页面吗？";

// IE
e.cancelBubble = true;
e.returnValue = msg;

// Firefox
if(e.stopPropagation)
e.stopPropagation();
e.preventDefault();


// Chrome / Safari
return msg;
;
</script>

ios 下fixed遮罩背景无法动态监听，解决办法

场景：当要弹出一个fixed的对话框(就是一个弹出框),同时给背景添加一个遮罩层，当操作完后想点击遮罩层关闭整个弹出框
条件1：fixed的遮罩层是动态创建的，使用click事件监听不到
条件2：在遮罩的下面有链接或是不能点击的元素(或有操作或有链接跳转等)

针对条件1，使用jQuery的on来监听整个文档，当冒泡到指定元素上时，再执行相应操作

针对条件2，使用touchstart/touchend，会产生点透问题

我的经验以及解决办法：

1、使用jQuery的delegate方法监听click事件

2、使用来自stackoverflow 的建议

On iOS there is no event bubbling without a cursor style. So in your CSS you need to add cursor: pointer; to the element。

因此，最后的解决办法，使用delegate来动态监听点击事件，在遮罩层上加上样式cursor:pointer

如果点击时不想出现一个黑层，可在全局设置*{-webkit-tap-highlight-color:rgba(0,0,0,0)“*”代表不想出现黑影层的元素}