移动端输入框固定在底部键盘抬起时遮挡住输入框

时间：2019-08-27 11:00:56 阅读：138 评论：0 收藏：0 [点我收藏+]

移动端开发时输入框使用fixed固定在底部时，抬起键盘会遮挡住输入框

监听输入框获得焦点

$(function(){

$("#pinglun").focus(function(){ //输入框获得焦点

var tHeight = $(document).height(); //获取当前屏幕高度，没用到

console.log(‘当前屏幕高度=‘+tHeight)

console.log(‘输入框获得焦点‘)

document.getElementById("dibu1").style.position = "relative" //获取焦点时更改定位，这个id是你定位输入框处的id

// document.getElementById("dibu1").style.marginBottom = "cheight"+‘px‘

setTimeout(function(){

document.getElementById("dibu1").scrollIntoView(true) //延时定位元素移动，键盘抬起需要时间

},200)

}).blur(function(){

console.log(‘输入框失去焦点‘)

document.getElementById("dibu1").style.position = "fixed" //失去焦点后改回定位状态

});

原文地址：https://www.cnblogs.com/lishuang2243/p/11416591.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

周排行