使用 AJAX 调用时如何存储到浏览器自动完成/自动填充 [英] How to store to browser auto-complete/auto-fill when using AJAX calls

问题描述

我注意到浏览器在提交表单之前不会存储表单值，这意味着如果您使用 AJAX 而不是标准表单提交，则永远不会填充浏览器的自动填充.有没有办法强制填充浏览器的自动填充/自动完成功能，以便我可以方便地使用通过 AJAX 提交的表单?每次转到我的 AJAX 页面并且必须在表单字段中输入相同的内容很烦人，因为浏览器不记得它们.

I've noticed that browsers do not store form values until the form is submitted, which means that if you're using AJAX instead of a standard form submit, your browser's auto-fill is never populated. Is there a way to force populate your browsers auto-fill/auto-complete so that I can have this convenience with forms that are submitted via AJAX? It's annoying to go to my AJAX page and have to type in the same things in the form fields every time because the browser doesn't remember them.

我的问题与这个问题几乎相同，除了仅提供 FireFox 中的解决方法作为该问题的公认答案.我正在寻找一种适用于所有主要浏览器(至少 Chrome、FF 和 IE)的解决方案，如果有的话.

My question is pretty much identical to the this one, except that only a work around in FireFox is provided as the accepted answer to that question. I'm looking for a solution that works in all major browsers (at least Chrome, FF, and IE), if there is one.

注意:我不是在谈论 AJAX 自动完成插件，这是在谷歌搜索这个问题时几乎总是弹出的.我指的是浏览器的内置自动完成功能或自动填充功能，它可以通过记住您过去输入的内容来帮助您填写表单.

推荐答案

对于仍在尝试解决此问题的任何人，似乎我已经找到了 答案.

For anyone who's still trying to solve this, seem like I've found the answer.

Chromium 会尝试识别提交事件，即使您阻止默认并自己处理实际提交也是如此.

Chromium tries to recognize the submit event, even if you preventDefault and handle the actual submission yourself.

就是这样，您需要preventDefault submit 事件，不是 click 事件.

That's it, you need to preventDefault the submit event, not the click event.

在撰写本文时，这适用于 Chrome、Edge 和 IE 11(我懒得在 Firefox 上下载和测试它).这是您的表格:

This worked on Chrome, Edge and IE 11 at the time of writing (I'm too lazy to download and test it on Firefox). Here's your form:

<form method="POST" id="my-form">
  <label>Email</label>
  <input autocomplete="email" type="email" name="email">
  <button type="submit">Subscribe</button>
</form>

注意 autocomplete 属性.这些都是可能的值可用于自动完成.

Notice the autocomplete attribute. These are all the possible values that you can use for autocomplete.

在 JavaScript 中，只需执行以下操作:

In JavaScript, simply do this:

$("#my-form").on("submit", function (ev) {
  ev.preventDefault();

  // Do AJAX stuff here
});

浏览器会记住您在点击订阅按钮时输入的任何电子邮件.

The browser will remember whatever email you've entered on clicking subscribe button.

这篇关于使用 AJAX 调用时如何存储到浏览器自动完成/自动填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！