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

防止HTML5自动对焦在较小(移动)屏幕上显示软键盘,html,mobile,autofocus,soft-keyboard,Html,Mobile,Autofocus,Soft Keyboard,使用HTML5属性“自动聚焦”对于网页来说是一件非常有用的事情。然而,在Android设备上使用Firefox(37.0.1)会导致在页面加载时显示软键盘 <input type="text" name="q" autofocus> 软键盘占用了很多空间,因此我想阻止它打开。同时,自动对焦是正常屏幕/设备所需的一项非常有用的功能 我尝试在页面加载时通过jQuery删除基于屏幕宽度的“自动聚焦”属性,但是,这已经太迟了。此时,浏览器显然已接受该属性并显示软键盘: $(functi

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

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

软键盘占用了很多空间,因此我想阻止它打开。同时,自动对焦是正常屏幕/设备所需的一项非常有用的功能

我尝试在页面加载时通过jQuery删除基于屏幕宽度的“自动聚焦”属性,但是,这已经太迟了。此时,浏览器显然已接受该属性并显示软键盘:

$(function(){
    if (window.innerWidth < 600)
        $('*[autofocus]').removeAttr('autofocus');
});
$(函数(){
如果(窗内宽度<600)
$('*[autofocus]')。removeAttr('autofocus');
});

有什么建议吗?

试试这个,它可以在桌面上使用,我还没有在手机上测试过。删除属性
autofocus

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

嗯,
autofocus
在做什么?我可以用JS/jQuery来复制它,但这并不是很优雅。但这是我心目中的一个选择。这确实有效,但我不希望对标记本身进行更改。除非出现其他解决方案,否则我会在以后将其标记为已接受。效果很好。但是,我认为最好检查windows对象中的“ontouchstart”事件,而不是windows宽度。这是因为分辨率增长非常快,三星S6的分辨率已经超过了我的27英寸屏幕
function setFocus() {
    if (window.innerWidth > 600)
        $("input[name=q]").focus();
}
$(document).ready(function() {
    setFocus();
});