javascript - 触发动态弹出窗口 HTML 表单的密码自动填充

Question

假设我有一个允许用户登录网站的 HTML 表单。表单不是静态可见的，而是通过 Bootstrap Popover 按需显示的。 .

除一个小细节外，这按预期工作:浏览器的密码管理器不提供这种形式的凭据自动完成(很可能是因为它在页面最初呈现时不可见)。

向表单和输入元素添加 autocomplete="on" 没有任何改变。

有没有办法在登录表单可见后再次触发表单完成？

表单如下所示:

<div id="login_popover_content">
  <form accept-charset="UTF-8" action="/users/sign_in" autocomplete="on" class="form-horizontal" id="new_user_popover" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="..."></div>
  <fieldset>
    <div class="control-group">
      <label class="control-label" for="user_login">User</label>

      <div class="controls">
        <input autocomplete="on" class="input-medium" id="user_login" name="user[login]" size="30" type="text">
      </div>
    </div>
    <div class="control-group">
      <label class="control-label" for="user_password">Password</label>

      <div class="controls">
        <input class="input-medium" id="user_password" name="user[password]" size="30" type="password">
        <span class="help-block"><a href="/users/password/new">Forgot your password?</a></span>
      </div>
    </div>
    <div class="control-group">
      <div class="controls pull-right">
        <input class="btn btn-warning pull-right" name="commit" type="submit" value="Login">
      </div>
    </div>
  </fieldset>
  </form>
</div>

弹出窗口使用:

$(anchor).popover(
  content: $(content).html()
  placement: 'bottom'
  html: true
  trigger: 'click'
  template: '<div class="popover headless"><div class="arrow"></div><div class="popover-inner"><div class="popover-content"><p></p></div></div></div>'
)

Answer 1

大多数浏览器(如果不是全部)会在页面初始加载时触发自动填充，因此如果 dom 在第二个时刻被操作，则不会自动填充。一种解决方案是将登录表单放在页面上。