Question

我正在开发一个网站，为用户提供租借设备的报价和预订。如果用户在流程中获得了多个步骤并选择关闭浏览器或在完成之前离开，那么客户端希望提供特殊交易。客户希望阻止窗口关闭，并询问他们的电话号码，以便他们可以以更好的价格打电话给他们。

我可以阻止窗口关闭并阻止浏览器导航。发生这种情况时，会显示一个div以供用户提交，并提供一个选项以继续关闭窗口。一切正常。问题是，如果用户刷新页面或点击后退或前进按钮，则操作被阻止，就像用户正在关闭浏览器一样。但我不在乎他们是前进还是后退或刷新页面，因为这意味着他们仍然在预订过程中。不幸的是，我无法区分这两类事件。

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

这是我正在使用的代码。当页面首次加载时，元素divSecondClose和divThankYou都设置为display：none。＆LT;％= DisplayThankYou％GT;表单提交后设置为“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();
}
}
}

Answer 1

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

以下是有关访问其中每项内容的指导性信息的链接。您可以通过上述组合找出您想要的内容，尽管在许多浏览器中检查所有案例似乎都非常残酷。 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刷新页面

1 个答案: