javascript - 区分离开网站和使用 Javascript 刷新页面

标签 javascript events navigation onbeforeunload back

我正在开发一个网站,该网站为用户提供租赁设备的报价和预订。如果用户在流程中执行了多个步骤,并选择关闭浏览器或在完成之前离开,那么客户就会愿意提供特价优惠。客户希望阻止窗口关闭并询问他们的电话号码,以便在有空时可以以更优惠的价格调用给他们。

我可以阻止窗口关闭并阻止浏览器离开。发生这种情况时,会显示一个 div,其中包含一些供用户提交的内容以及继续并关闭窗口的选项。这一切都很好。问题是,如果用户刷新页面或点击后退或前进按钮,则该操作将被阻止,就像用户关闭浏览器一样。但我不在乎他们是否前进、后退或刷新页面,因为这意味着他们仍在预订过程中。不幸的是,我无法区分这两种类型的事件。

我将一个函数附加到 onbeforeunload 事件以触发向用户发送的消息。我正在开发的网站是一个 ASP.NET 网站,如果这对任何人都有帮助的话。

这是我正在使用的代码。当页面首次加载时,元素 divSecondClose 和 divThankYou 都设置为 display:none。提交表单后,<%=DisplayThankYou%> 设置为“true”,以便显示感谢消息。

var showSecondCloseOnExit = true;
var displayThankyou = '<%=DisplayThankYou %>';
if (displayThankyou == true)
{
var divSecondClose = document.getElementById('divSecondClose');
divSecondClose.style.display = '';

var divThankYou = document.getElementById('divThankYou');
divThankYou.style.display = '';

showSecondCloseOnExit = false;
}
else
{
addListener(window, 'beforeunload', CloseWindowEvent, false);

var allLinks = document.getElementsByTagName('a');
for (var linkIndex = 0; linkIndex < allLinks.length; linkIndex++)
{
  addListener(allLinks[linkIndex], 'click', function(){showSecondCloseOnExit = false;}, false);
}
}

function CloseWindowEvent(e) {

if(!e) e = window.event;

if (showSecondCloseOnExit)
{
  var divSecondClose = document.getElementById('divSecondClose');
  divSecondClose.style.display = '';
  showSecondCloseOnExit = false;

//e.cancelBubble is supported by IE - this will kill the bubbling process.
e.cancelBubble = true;
e.returnValue = 'RATE CHANGE NOTIFICATION\nWould you take a moment before you leave to help us serve you better?';

//e.stopPropagation works in Firefox.
if (e.stopPropagation) {
  e.stopPropagation();
  e.preventDefault();
}
}
}

最佳答案

您是否尝试过嗅探事件的各种不同值: *类型 *目标元素 *鼠标位置

这里是一个链接,其中包含有关访问其中每一个的指导信息。尽管在许多浏览器上检查所有情况似乎相当残酷,但您也许能够通过上述组合来弄清楚您想要什么。 http://www.quirksmode.org/js/events_properties.html#type

此外,请参阅以下文章,了解如何在窗口关闭时附加到事件,仅此而已: How to create popup window when browser close

但是,您也可以向产品负责人告知您正在做的事情,因为执行您所描述的功能的成本变得相当高。

注意:请参阅 Slak 的评论:How to capture the browser window close event? 。这可能就是您所追求的。

关于javascript - 区分离开网站和使用 Javascript 刷新页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4719418/

相关文章:

javascript - 当我更改 document.getElementById 时,Ajax 不起作用

javascript - Ajax 函数在第二次运行之前没有完成

model-view-controller - 从 Symfony2 Controller 中删除 Doctrine 生命周期事件

javascript - 按下按键时如何移动鼠标光标?

jquery - DDSmoothmenu(动态驱动器)在加载页面时显示扩展菜单(丑陋!)

javascript - 单击链接时调用函数,即使该链接是新添加的

javascript - 在 Ajax 响应回调中调用本地 JavaScript 方法

这个关键字的 Angular 6 范围在子组件中是不同的

android - 如何将 android 导航堆栈弹出到某个 fragment ?

iphone - 隐藏第二个 View Controller 并导航到第三个 View Controller