直到在体内单击鼠标一次，Onbeforeunload才起作用 [英] Onbeforeunload doesn't work until mouse is clicked once in the body

问题描述

经过一整天的努力，找到了解决此问题的方法之后，我仍然遇到同样的问题.

After a long day of trying to find a solution to this problem, I keep getting the same issue.

基本上，我有一个站点，如果用户单击浏览器刷新"按钮，我想弹出一个您确定"警报框，其中包含重新加载"和不重新加载"选项(基本上是浏览器返回的内容).

Basically, I have a site, if the user clicks on the "browser-refresh" button, I want to pop-up a "are you sure" alert box with the options "reload" and "don't reload" (Basically, what the browser returns).

令人惊讶的是，它在IE中可以正常工作.但是在chrome或firefox中，刷新通常会在没有弹出窗口的情况下进行.

Surprisingly, it works just fine in IE. But in chrome or firefox, the refresh happens normally without a popup.

仅当我在某些位置单击主体，然后单击浏览器刷新"按钮时，才会显示弹出窗口.

The popup only appears if I click on the body some where and then click on the "browser-refresh" button.

我已经有了以下以及其他许多类似的选择:

I already the following and other many similar alternatives :

window.onbeforeunload = function (e) {
    e = e || window.event;

   // For IE and Firefox prior to version 4
   if (e) {
       e.returnValue = 'Any string';
   }

  // For Safari
  return 'Any string';
};

我试图用'trigger('click')'，'.click()'事件模拟页面加载时的click事件.

I tried to simulate a click event on page load with 'trigger('click')', '.click()' events.

但是，直到我自己(身体上)单击身体后，它仍然无法工作.

But, still doesn't work until I click on the body myself (physically).

我创建了一支简短的笔，它可以复制我所面临的问题.

I've created a short pen, which replicates the issue I'm facing.

https://codepen.io/kanchanrai/pen/LQEZYV

任何帮助将不胜感激.提前致谢.

Any help would be very highly appreciated. Thanks in Advance.

推荐答案

也许是较晚的答案...

Maybe a late answer...

这是有关beforeunload事件的MDN文档的内容:

注意:为防止不必要的弹出窗口，浏览器可能不会显示在preunload事件处理程序中创建的提示，除非已与该页面进行了交互，或者甚至根本不显示它们.

Note: To combat unwanted pop-ups, browsers may not display prompts created in beforeunload event handlers unless the page has been interacted with, or may even not display them at all.

这与您观察到的行为相符.

This matches the behavior you observed.

这篇关于直到在体内单击鼠标一次，Onbeforeunload才起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！