用户尝试刷新浏览器时如何获取“确认表单重新提交”
我有一个页面,不允许用户通过单击浏览器刷新按钮或按F5刷新页面。 所以我想模拟’form resubmission’以显示提示信息。
有人可以指导我实施它的方法吗?
有没有可用的跨浏览器解决方案?
要在不收到提示的情况下刷新,必须使用HTTP GET
获取页面
使表单具有method="GET"
而不是method="POST"
(并修复服务器进程以适应此更改)
或者,将后期数据缓存在会话中,并在表单提交后立即使用HTTP代码303
重定向到显示页面。
如果要引发提示,请将用户带到页面的链接转换为POST表单上的提交按钮。 如果用户使用GET请求到达,则向他们提供具有javascript的页面,该页面提交将请求转换为POST请求的表单。
你是如何设法禁用一切的?
对于浏览器按钮, 每个MDN交叉兼容 :
window.onbeforeunload = function() { return "Data will be lost if you refresh the page. Are you sure?"; };
对于击键:
window.addEventListener("keyup", checkForRefresh, false); var checkForRefresh = function(event) { if (event.keyCode == 116) { alert("Data will be lost if you refresh the page. Are you sure?"); } };
键击可能需要IE8的polyfill,但它们在文档中提供它。
你想要的是听取beforeunload
事件并抛出一个确认框。
编辑:既然你已经在评论中说明了你需要支持Mobile Safari (它不支持beforeunload
。你可以尝试像jquery.AreYouSure这样的库
根据这个页面的讨论 ,它支持Mobile Safari,虽然我自己没有使用它
请注意,某些浏览器会忽略您在confirm
调用中提供的文本,而是显示其默认文本。 有更深入的方法可以解决这个问题,但这会提示对话框。
$(window).on("beforeunload", function() { return confirm("Do you really want to close?"); });
从其他讨论:
人们过去常常采用两种方法:
方法1:使用AJAX +重定向这种方式使用JQuery或类似于Page2的方式在后台发布表单,同时用户仍然看到显示的page1。 成功发布后,您将浏览器重定向到Page2。
方法2:发布+重定向到自己
这是论坛上的常用技巧。 Page1上的表单将数据发布到Page2,Page2处理数据并执行需要完成的操作,然后对自身执行HTTP重定向。 这样,浏览器记住的最后一个“动作”是第2页的简单GET,因此在F5上不会重新提交表单。
你可以参考这个答案: https : //stackoverflow.com/a/3968038/1853444