文档准备就绪后提交和浏览器历史记录

Question

当DOM准备就绪时，我在页面中有以下代码来自动提交表单：

$(function () {
    $('form').submit();
});

然而，如果用户在下一页上单击浏览器上的“back”按钮，则会返回到此页面之前的页面，而不是包含此代码的页面（无论使用 Chrome/IE 还是其他浏览器）。即浏览器历史记录中缺少包含表格的页面。

这很棒，但我想知道现代浏览器是否都有此功能？我正在寻找一个引用官方来源的答案，可以从互联网标准文档或浏览器供应商那里得到他们实现的机制。

仅当我在 DOM 准备好或窗口加载事件中调用 submit() 函数时，才会出现此问题。

例如，此代码将在单击页面（向前/向后）后在浏览器历史记录中显示表单页面：

document.addEventListener('click', function () { document.forms[0].submit(); }, false);

以下代码片段不会：

document.addEventListener('DOMContentLoaded', function () { document.forms[0].submit(); }, false);
window.addEventListener('load', function() { document.forms[0].submit(); }, false);
window.onload = function () { document.forms[0].submit(); };

- SilverlightFox

---

是的，你说得对。如果你尝试在文档加载时提交表单，那么如果你使用浏览器的后退按钮导航，它将不会被添加到历史记录中。这篇文章或许能帮到你，请查看：https://dev59.com/H3VC5IYBdhLWcg3w4VRz。 - Amit

就像朝鲜一样，您可以根据需要操纵历史记录：http://html5doctor.com/history-api/ - logic-unit

不仅在domReady中...甚至在_runtime script_和$(window).load中也是如此。 - Frogmouth

@amit 谢谢，但那不完全相同。 - SilverlightFox

就像朝鲜一样，你可以操纵历史。LOL - divyaSharma

Answer 1

我以前也遇到过这个问题。我不希望“后退按钮”将用户带回上一页。使用“onbeforeunload”解决了我的问题...

但是你的问题与以下概念有关

- 浏览上下文 - 会话历史记录 - 替换启用（标志）

---

1. “浏览上下文”是向用户呈现“文档”对象的环境。

2. 在“浏览上下文”中，“文档”的序列是其“会话历史”。 “会话历史”将这些“文档”列为平面条目。

3. 当我们从“会话历史”中的一个“文档”传播到另一个“文档”时，“替换启用”生效。如果遍历是以“替换启用”开始的，则会删除指定条目（在“会话历史”中）之前的条目。

注意 Web浏览器中的选项卡或窗口通常包含一个浏览上下文，iframe或frameset中的框架也是如此。

---

从逻辑上思考，通过调用任何这些

document.addEventListener( 'DOMContentLoaded', function() {document.forms[0].submit();}, false );
window.addEventListener( 'load', function() {document.forms[0].submit();}, false );
window.onload = function() {document.forms[0].submit();};

你正在建议浏览器执行#3，因为这些调用的意思是页面加载后立即传播。即使对我来说，这段代码显然是要从“会话历史记录”中清除的 :)。

进一步阅读...

• onbeforeunload
• browsers
• browsing-context
• unloading-documents
• replacement-enabled

- Patt Mehta

---

即使对我来说，那段代码显然是要从“会话历史记录”中清除的 :)。这是一个有趣且富有启发性的回答。 - divyaSharma

Answer 2

由于这段代码在响应 click 事件时会在历史记录中留下页面：

document.addEventListener('click', function () { document.forms[0].submit(); }, false);

以下代码片段不会在浏览器历史记录中留下页面记录（DOMContentLoaded 和 window onload 事件）：

document.addEventListener('DOMContentLoaded', function () { document.forms[0].submit(); }, false);
window.addEventListener('load', function() { document.forms[0].submit(); }, false);
window.onload = function () { document.forms[0].submit(); };

可以假设现代浏览器不会记录在窗口加载或文档准备处理程序中发生的页面导航的导航历史记录。

- SilverlightFox

---

我还会添加一个测试，以查看是“函数包装器”（load、domcontentloaded）导致它无法被“历史记录化”，还是这些方法的“时间”。我的意思是，这将是一个很好的测试来找出答案：window.addEventListener('load'，function(){setTimeout(function(){document...form...submit},3000);});。 - Royi Namir

Answer 3

当用户点击返回按钮时，浏览器会显示页面的缓存副本。表单提交不会缓存页面，因此它不会出现在您的历史记录中。

- msbarnard

---

您的Internet缓存位于硬盘上的“临时Internet文件”文件夹中。 您的Internet历史记录是您访问过的所有网站的记录。 它们是彼此独立的。 - skam

Answer 4

是的，从onload事件处理程序重定向会导致新URL替换您在历史记录中留下的URL（因此不会添加无用条目）。但这不是唯一触发该替换的方式，它也可能是由于任何快速发生的位置更改引起的，这种延迟旨在避免在基于JavaScript的重定向的情况下污染历史记录。

很难找到有关该主题的任何规范，但在Firefox上，此延迟似乎为15秒。以下是来自moz开发人员之一的bugzilla中对此延迟的提及：

Mozilla使用15秒的阈值来决定页面是否应保留在历史记录中。如果网站使用并在15秒内重定向到另一个站点或在onLoadHandler()等中重定向到另一页，则重定向的页面将替换（从而消除）历史记录中的重定向页面。如果重定向发生在15秒后，则重定向页面仍然保留在历史记录中。

人们可以就时间限制进行争论。但这只是我们认为合理的数字

- Denys Séguret