如何使浏览器保存密码而不进行重定向？

问题描述

我们有一个带有用户名 密码输入和一个按钮的表单。单击按钮后，通过将/?添加到当前的url中，表单将重定向到另一个url。

如果我们添加event.preventDefault()，它将阻止浏览器提供保存用户名和密码的功能（见下图，我的意思）。

这是代码。它不在此处重定向，因为它位于摘要中。

document.getElementById('send').addEventListener('click',(event) => {
  //event.preventDefault()
  console.log('test')
})

<form>
  <div>
    <label for="username">username</label>
    <input
      id="username"
      type="text"
      autocomplete="username"
    />
    <label for="password">password</label>
    <input
      id="password"
      type="password"
      autocomplete="new-password"
    />
  </div>
  <button id="send">send</button>
</form>

我尝试使用div而不是form标签，但是它也阻止了自动完成功能。

此外，here您可以使用浏览器产品测试表单以保存密码。从here

复制代码

如何防止单击按钮时重定向并保留浏览器的自动完成功能？

解决方法

为防止重定向时单击按钮，请为按钮元素设置type =“ button”，这会将按钮元素变成一个普通按钮，然后您便知道将使用AJAX提交表单：

.intel_syntax noprefix

这是您要寻找的答案

,

用于自动完成的'new-password'值应防止自动填充，因为浏览器希望在此处输入新密码。根据{{​​3}}：

防止使用autocomplete =“ new-password”自动填充

如果要定义用户管理页面，用户可以在其中指定一个 另一个人的新密码，因此您要防止 自动填写密码字段，您可以使用 autocomplete =“ new-password”。

我认为MDN可能会帮助

,

我还没有检查。但是您可以尝试以下方法：

document.getElementById('send').addEventListener('click',(event) => {
  console.log('test');
  return false;
})