防止HTML5自动对焦在较小的(移动)屏幕上显示软键盘

Question

使用HTML5属性“自动焦点”对于网页来说是非常有用的。然而，例如，在Android设备上使用Firefox (37.0.1)会导致页面加载显示软键盘。

<input type="text" name="q" autofocus>

软键盘占用了很大的空间，因此我想防止它打开。同时，自动对焦是一个非常有用的功能，我们需要正常的屏幕/设备。

我试着在页面加载时通过jQuery删除基于屏幕宽度的“自动焦点”属性，但为时已晚。此时，浏览器显然已经接受了该属性，并显示了软键盘：

$(function(){
    if (window.innerWidth < 600)
        $('*[autofocus]').removeAttr('autofocus');
});

有什么建议吗？

Answer 1

试试这个，它在桌面上工作，我还没有在手机上测试过它。删除属性autofocus

<input type="text" name="q">

和JS

function setFocus() {
    if (window.innerWidth > 600)
        $("input[name=q]").focus();
}
$(document).ready(function() {
    setFocus();
});