如何阻止esc键停止重定向

时间:2016-01-23 01:58:55

标签: javascript ajax forms keyboard submit

使用AJAX提交订单:

  1. 用户填写表单并点击提交
  2. 禁用提交按钮以防止多次点击
  3. 弹出模式通知正在提交订单
  4. 通过ajax
  5. 提交表单
  6. 如果成功,则重定向到订单确认页
  7. 如果不成功,解释原因,隐藏模态,重新激活提交......等等。
  8. 问题是,当他们点击提交时,如果他们点击转义键,则可以停止重定向,然后即使订单在技术上已经通过,页面也会停留在待处理状态。

    问题:

    如何阻止用户使用转义键停止重定向?

    我认为用户甚至不知道他们正在做什么,但在我的情况下,订单已经处理完毕。点击逃脱只会让他们看不到他们的确认页面,可能会让他们认为订单没有通过。

    有没有其他/更好的方法来处理这种情况?

2 个答案:

答案 0 :(得分:0)

我不知道你要做什么,但是我假设在成功破坏你的网站逻辑之后留在页面中,我会给你一些提示

但请注意,此问题没有最终解决方案,用户可以单击浏览器上的停止按钮,或者他可以一起关闭选项卡!

所以我假设这只是为了防止用户错误

第一种方式:当成功回调触发时,将一个布尔变量作为标志保存成功状态,现在当用户再次提交时,如果它是真的你可以再次重定向,或者甚至可以放一个尝试重定向的定时器x秒,例如基于此标志

第二种方式:(我不确定这是否有效!)为转义按钮注册键盘事件,并使用event.stopPropagation消耗事件,这可能甚至取决于浏览器

答案 1 :(得分:0)

您的原始提交将Ajax请求发送到某些Web服务以完成订单,例如/ordersubmit。成功下单后,Web服务中的逻辑将返回重定向响应。响应可能需要一些时间,用户可以在收到响应之前取消请求。

创建一个新的Web服务,例如/orderstatus,检查订单,如果成功,则返回与/ordersubmit相同的重定向响应。如果订单仍处于暂挂状态或有错误,则返回合适的邮件正文。

Web订单页面在向/ordersubmit发出初始Ajax请求后启动了计时器。当计时器到期时,页面向/orderstatus发送新的Ajax请求并对响应进行操作。

如果响应不是重定向,则启动新计时器并再次检查。如果在三次尝试之后订单仍未完成,则显示一条合适的消息,要求他们联系支持部门。

相关问题