HTML5 - нежелательный <form> автофокусировка на мобильных браузерах

Question

Моя учетная запись имеет две формы; когда вы переходите на страницу в мобильном браузере (подтвержденный на Android и iOS), он автофокусируется на первом входном элементе в форме второй и открывает клавиатуру, перепрыгивая через первую форму.

Все, что я хочу, это полностью остановить автофокус, потому что он пропускает некоторые инструкции предварительной регистрации. (Хотя было бы также хорошо, чтобы понять почему/как это происходит, и почему он выбирает второй формы, чтобы сосредоточиться на!)

• Ни одна из форм имеют атрибут autofocus установить
• I» пробовали добавление id="top" и не связывая с /signup#top - никакой разницы
• у меня $(window).scrollTop(0) работает после того, как страница отображается (неродственной причина) - никакой разницы
• Я использую Meteor/Blaze с Semantic UI
• Первая форма моя, вторая форма является 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(); 
    }); }