在离开页面之前询问用户确认的最佳方式

Question

我目前正在建立一个注册页面，如果用户离开，我想弹出一个CSS框询问他是否确定。我可以使用确认框来完成这个壮举，但客户说他们太难看了。我尝试过使用unload和beforeunload，但两者都无法阻止页面被重定向。使用那些事件，我返回false，所以也许有一种方法可以取消而不是返回false？

我所拥有的另一个解决方案是将它们重定向到另一个包含弹出窗口的页面，但问题是如果他们确实想要离开页面，并且这不是一个错误，他们就会丢失页面最初试图去。如果我是用户，那会让我感到烦恼。

最后一个解决方案是真正的弹出窗口。我唯一不喜欢的是主要的winow将有他们的目标页面，而pop将有我的页面。在我看来，它看起来不相干。最重要的是，我会担心弹出窗口拦截器。

只是添加每个人的评论。我知道阻止用户退出页面是令人恼火的，我认为不应该这样做。现在我正在使用确认框。发生的事情是它实际上并没有“阻止”用户离开，如果用户对注册有疑问，客户实际想要做的是提出建议。如果用户处于注册过程的中途并且由于某种原因离开，则客户希望向用户提供免费优惠券到研讨会（该客户正在销售研讨会）以希望说服用户注册。客户的印象是，由于用户已经在表单上，​​他正在考虑注册，因此他正在注册的内容可能是让用户注册的最终推动。理想情况下，我不必阻止用户离开，什么会一样好，而且在我看来更好的是我可以暂停卸载过程。也许睡觉命令？我不必将用户留在页面上，因为他们将离开去任何一个不同的页面。

此外，正如人们所说，这是一个非常可怕的标题，所以如果有人知道一个更好的标题，我真的很感激它，如果他们可以将标题更改为没有垃圾邮件邀请者邀请的东西。

Answer 1

当我看到“阻止用户”这个词时，我开始痛苦地哭泣。 从不 阻止用户，只能帮助他们。

如果他们看到您的注册页面并且没有，那是他们的选择。如果他们已经填写了一些数据（因为他们可能会意外导航），请弹出一个javascript确认框，但保留它。如果他们没有触及表单，请不要管它们 - 他们不希望填写表单。

了解吸引用户的其他方法。如果您的表单庞大而且可怕，请将其分解为简单易管理的块或更好的，简化操作以至于用户只在您需要时为您提供数据。例如，在您想要向他们发布内容之前，您可能不需要他们的地址。

通过将其分成多个部分，您可以用简单的形式将它们挂钩，一旦他们投入了这些时间，他们就更有可能继续这个过程。

但不要骚扰用户。如果他们不想注册，那么用弹出窗口和jaavscript对话来纠缠他们就会完全将他们赶出网站。

考虑到这一点，假设你只是试图阻止人们填写半填表格，有几种方法可以真正帮助别人：

1. 检测表单是否已更改，并向他们询问简单的confirm()消息。

   这就是你能做的一切。 CSS“pop-in”无法正常工作，因为您无法在卸载事件中控制*窗口位置。

   *您可以在您的所有网页链接上放置一个事件监听器来触发检查表单，但这只有在用户点击其中一个链接时才有用。例如，如果用户单击或关闭窗口，则无济于事。你可以同时执行CSS和javascript，但最终会有点混乱。

2. 坚持幕后形式的状态。

   ＃1的扩展名。而不是与用户争吵，让他们去他们想要的地方，但将表格的内容保存到会话或cookie（如果它适合）并在页面上放一些东西（如页面顶部的SO的橙色提示栏） ）它提醒他们，他们已经开始填写表格并给他们一个回到表格的链接。

   当他们点击该链接时，您将数据从cookie（或会话）中加载回表单并让它们继续。这有明显的好处，让他们在您的网站上做他们喜欢的事情，并保持数据的安全..是。

   如果他们没有回来并且他们的cookie /会话到期，那就是他们的错。你只能把马带到水里。强迫它喝酒不是你的工作。

Answer 2

不要这样做。

但如果你想，试试这个。记录鼠标位置并检测快速向上推力 - 用户正在到达BIG X或左上角或右上角。现在可能是你在屏幕上显示一个不显眼的盒子的机会。

我在网上看过这个工具，这很邪恶。

Answer 3

如果要捕获链接，可以重写页面中的链接以转到“你真的想要离开吗？” javascript函数，将目标URL作为参数传递。

如果您想阻止用户使用“后退”按钮，或阻止他们在地址栏中输入其他网址，停止。立即停止。 （1）制作浏览器是为了防止这种令人讨厌的行为，（2）即使他们允许，也要看（1）的最后两个字。 这很粗鲁。无论你认为它有多酷，你的网站都不是那么特别。

Answer 4

window.onbeforeunload = function() { return "Message"; };

使用这样的JavaScript显示请假确认消息。

Answer 5

以下是我能想到的几种方法，但它们并非没有缺陷：

要做什么技术

检测朝向浏览器边缘的鼠标位置，因为用户可能要关闭标签，窗口，返回，在其他地方导航。如果是这样，立即提示他们这可能是一个错误，他们将失去一些非常有价值的东西。然而，这里的问题是你不确定他们的意图是什么，你可能会用弹出窗口惹恼他们。此外，他们可能会使用一堆快捷键，例如 Ctrl + W 等来做同样的事情。

你有邮件技术

如果您在关闭页面之前设法抓住了用户的电子邮件地址，那么您已经获得了累积奖金。一旦用户在电子邮箱中输入任何内容然后离开它，立即使用AJAX将其发送到服务器。使用cookie或其他内容将页面状态保存到localStorage或服务器上，以便稍后重新创建。每隔几个小时就会给他们发送一封电子邮件，直接链接到之前保存的表格，这次可能会有特别优惠。

历史重复本身技术

然后是臭名昭着的历史操作，你将当前页面堆叠到文档历史记录中，这样后退按钮实际上变得毫无价值。

不要将所有鸡蛋放入一个篮子技术中

我头脑中的另一项技术是使用注册表单在后台创建多个窗口，并在任何一个字段发生变化时保持它们全部同步。这是一种经典的技术，真正把“不要把所有鸡蛋放在一个篮子里”说成现实生活。

这种令人敬畏的技术的另一个优点是，即使用户关闭其中一个窗口，后来遇到一个相同的克隆窗口，其中填充了所有填充的字段，他们可能会感到困惑，并认为他们从不关闭页面。猜猜看，这次他们可能会继续并填写注册表格。但是你必须对此保持谨慎，因为任何超过2或3个克隆的内容都会显示出正在发生的事情。

你是赢家技术

另一种技巧是告诉每个用户他们是网站上的第X个访问者，并使用一个好的四舍五入的数字，例如1000,10000,50000等。告诉他们一旦他们注册了他们就可以领取奖品。现场。想象一下每个用户登陆您网站时的感受。奖品不一定是有形的，它可以是你在intertubes上找到的免费优惠券。

您今天想去哪里？技术 ¹

这基本上是你的答案的剽窃。在document.location.href = 'some url'回调中使用onbeforeunload可在卸载之前导航到其他页面。

¹ 仅限Firefox。

注意：除非您使用自己的安全策略编写自己的浏览器，否则此处没有银弹解决方案，但这些都是您可以做的优化，使用户完全无法离开。

Answer 6

并非所有浏览器都支持模式弹出窗口，如果没有这种模式弹出窗口，您的页面将会继续并导航。

这是非常糟糕的要求。这种要求在桌面应用程序中是合理的，但是网站的整个不合理的功能。想象一下，无法离开网站。

答案是使用可怕的确认框并将其弄糊涂。或者不要求用户每页输入太多数据。使用分步向导样式数据输入，可以最大限度地减少意外导航造成的损失。

Answer 7

您可以使用document.location.href = "www.website.com"

更改网址的值

Answer 8

  

我可以使用确认框完成此专长，但客户说他们太难看了。

如果问题是标准JS弹出框的丑陋，请尝试以下方法：http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/

除此之外，大多数人都会说：如果你不想失去用户，请谨慎行事。