如何让浏览器记住Ajax提交时自动完成的表单值? [英] How can I make browser remember form values for autocomplete on ajax submit?

问题描述

我已经创建了一个表单，该表单在提交时会对提交进行ajax调用.这不是标准表单提交.如何使浏览器记住表单数据(而不仅仅是用户名和密码)以进行自动完成?我尝试将表单提交到隐藏的iframe，但仅适用于chrome.是否有可以在所有浏览器上使用的解决方案或解决方法.

I have created a form, which on submit does a ajax call for the submission. It is not a standard form submit. How can I make browser remember form data(not just username and password) for autocomplete? I have tried submitting the form to hidden iframe but it is only working for chrome. Is there a solution or workaround which can work on all the browser.

推荐答案

我终于找到了解决方案.

I finally found the solution to this.

基本上，当表单上触发 submit 事件时，浏览器会存储输入值.

Basically the browser store the input value when the submit event is triggered on the form.

所有您需要做的就是通过调用 event.preventDefault()函数防止页面重新加载，并使用Javascript处理其余部分.

All you need to do is then prevent the page reload by calling the event.preventDefault() function and handle the rest with Javascript.

这是一个基本示例: https://codesandbox.io/s/phnsn

<form name="jsForm">
    <input type="text" name="search" autocomplete="search" />
    <button type="submit">Search</button>
</form>

<script>
    document.jsForm.addEventListener("submit", function(event) {
        event.preventDefault();

        // Handle Ajax call here
    });
</script>

请记住，如果您在提交"按钮上添加了click事件，则仍然需要以编程方式触发 submit 事件.因此，最好使用带有提交类型的按钮.

Keep in mind that if you added a click event on the submit button, you still need to programmatically trigger the submit event. So it's best to use a button with submit type.

这篇关于如何让浏览器记住Ajax提交时自动完成的表单值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！