我有一个简单的 HTML 表单,其中输入元素(文本框)位于页面中央。问题出在移动设备(特别是 Android)上,当键盘出现时,它会覆盖其中的一些元素。即使我在填写表格时点击下一步,页面也不会滚动以显示隐藏的元素。有什么建议么?我可以添加一些 JavaScript 或 CSS 吗?
最佳答案
尝试使用 onfocus javascript 事件。如果您使用 JQuery,则可以使用此示例,如果设备是触摸屏设备,它会在每个输入焦点事件中将输入滚动到视口(viewport)的最顶部。
function isTouchDevice() {
try {
document.createEvent("TouchEvent");
return true;
} catch (e) {
return false;
}
}
$("input").focus(function(){
if( isTouchDevice() ){
$('html, body').animate({
scrollTop: $(this).offset().top
}, 1000);
}
})
关于javascript - Android 键盘覆盖 Web 表单上的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34214359/