Question

我的注册页面有两种形式;当您在移动浏览器上访问该页面（在Android和iOS上确认）时，它会自动调整第二个表单中的第一个输入元素并打开键盘，跳过第一个表单。

我想要的就是完全停止自动对焦，因为它会跳过一些预注册说明。（虽然了解为什么/如何这种情况也会很好，以及为什么它选择第二个形式来关注！）

两种形式都没有设置autofocus属性
我尝试添加id="top"并链接到/signup#top - 没有区别
我在呈现页面后运行$(window).scrollTop(0)（出于无关原因） - 没有区别
我正在使用带语义UI的Meteor / Blaze
第一个表单是我自己的，第二个表单是userAccounts包注册表单

<div class="ui segment">
  <p>Information that is skipped past</p>

  <form class="ui form" id="welcomeFormEmail">
    <input type="email" name="preLaunchEmail" placeholder="Your email address">
    <button type="submit">Submit</button>
  </form>

<div class="at-pwd-form">
  <form id="at-pwd-form" action="#" method="POST" class="ui large form">
    <div class="ui stacked segment">
      <div class="at-input required field">
        <div class="ui fluid input icon">
          <input type="email" id="at-field-email" name="at-field-email" placeholder="Email" autocapitalize="none" autocorrect="off">
        </div>
      </div>

<!-- Various other fields -->
<!-- Various other fields -->
<!-- Various other fields -->

    <input type="submit" class="at-btn ui fluid large primary button" id="at-btn" value="Register">
  </div>
</form>
</div>
</div>

为什么会发生这种情况以及如何阻止它？

Answer 1

你可以使用模糊

如果您只有一个文本输入，则可以使用getElementById获取它并将其设置为模糊

 document.getElementById("myAnchor").blur();

但如果您有多个文本输入，则此循环会获取页面上的所有输入并禁用所有输入

var elelist = document.getElementsByTagName("input"); for(var i = 0; i < elelist.length; i++){
    elelist[i].addEventListener("focus", function(){
        this.blur();
    }); }

HTML5 - 移动浏览器上不需要的<form>自动对焦

1 个答案: