我正在编写一个带有三个文本输入的非常简单的网络应用程序。输入用于生成结果，但所有工作都是在 Javascript 中完成的，因此无需提交表单。我试图找到一种方法让浏览器存储自动完成的输入值，就像它们在提交的表单中一样。
我试过手动输入 autocomplete="on" ，但没有提交表单，浏览器无法知道何时应该存储值，所以这没有效果。
我还尝试将输入包装在具有 onSubmit="return false;" 的表单中，但是阻止表单实际提交似乎也阻止了浏览器存储其输入的值。
当然可以手动使用 localStorage 或 cookie 来持久化输入，然后从中生成自动完成提示，但我希望找到一种解决方案，可以利用本地浏览器行为，而不是手动复制它。
用 Chrome、IE 和 Firefox 测试：
<iframe id="remember" name="remember" class="hidden" src="/content/blank"></iframe>
<form target="remember" method="post" action="/content/blank">
<fieldset>
<label for="username">Username</label>
<input type="text" name="username" id="username" value="">
<label for="password">Password</label>
<input type="password" name="password" id="password" value="">
</fieldset>
<button type="submit" class="hidden"></button>
</form>
在您的 Javascript 中触发提交，例如 $("form").submit();$("#submit_button").click() （从评论更新）
您需要在 /content/blank 返回一个空页面以获取和发布（about:blank 对我不起作用，但 YMMV）。
我们知道浏览器只有在提交表单时才会保存它的信息，这意味着我们不能用return false或取消它e.preventDefault()
我们可以做的是让它在不重新加载页面的情况下将数据提交到任何地方。我们可以用一个iframe
<iframe name="💾" style="display:none" src="about:blank"></iframe>
<form target="💾" action="about:blank">
<input name="user">
<input name="password" type="password">
<input value="Login" type="submit">
</form>
JSfiddle 上的演示（在 IE9、Firefox、Chrome 中测试）
目前接受的答案的优点：
没有额外的javascript。您通常将处理程序附加到submit表单的事件以发送 XHR 并且不要取消它。
// for modern browsers with window.fetch
document.forms[0].addEventListener('submit', function (event) {
fetch('login.php', {
method: 'post',
body: new FormData(event.target))
}).then(r => r.text()).then(() => { /* login completed */ })
// no return false!!
});
理想情况下，您也应该让表单在没有 javascript 的情况下工作，因此删除target并将操作设置为将接收表单数据的页面。
<form action="login.php">
然后在添加submit事件时通过 javascript 添加它：
formElement.target = '💾';
formElement.action = 'about:blank';
我还没有测试过这个，但是如果您将表单提交到隐藏的 iframe（这样表单实际上已提交但当前页面不会重新加载），它可能会起作用。
<iframe name="my_iframe" src="about:blank"></iframe>
<form target="my_iframe" action="about:blank" method="get">...</form>
---没有 IFRAME---
您可以使用 action="javascript:void(0)" 而不是使用 iframe，这样它就不会转到另一个页面并且自动完成将存储值。
<form action="javascript:void(0)">
<input type="text" name="firstName" />
<button type="submit">Submit</button>
</form>
也许你可以使用这个Twitter Typeahead ......是一个非常完整的自动完成实现，具有本地和远程预取，这利用 localStorage 来持久化结果，并在输入元素中显示一个提示......代码是易于理解，如果您不想使用完整的 jquery 插件，我想您可以查看代码以了解如何实现您想要的...