ios输入框被软键盘遮住问题

2017-08-12 20:15:30来源:CSDN作者:zb_ctrl人点击

分享

在ios中,输入框被软键盘遮住,这是众所周知的bug,那么如何来解决这个问题呢?最近的项目中就遇到了这个问题,然后经过高人指点解决了这个问题,以及遇到的另外一些问题。
首先我们先来说说弹出软键盘,在ios中,弹出软键盘,会将整个页面给怼上去,因此我们只能看到半个页面,然而在andriod中,整个网页高度会缩小,因此我们在弹出软键盘时,能够监听到andriod的窗口大小变化——resize事件,但是ios中,resize事件却没有发生,因为窗口大小没有发生变化。
ios中弹出软键盘后,有时会遮住我们定位在底部的输入框,最近的项目中就遇到了各种ios的坑,哎!
html代码如下:

<div class="bottomInput">    <input id="msgdata" type="text"></input>    <button id="btn" class="wxapp-add-btn" >发送</button></div>

js代码如下:

var interval;function scrollToEnd(){    document.body.scrollTop = document.body.scrollHeight;}$("#msgdata").on("focus",function (e) {    interval = setInterval(function() {        scrollToEnd();    }, 500)})$("#msgdata").on("blur",function (e) {    clearInterval(interval);})$("#btn").on("touchend",function (e) {    e.preventDefault();    alert("消息发送");})

经过测试,iphone 6s是可行的,后来在6s plus中却遇到问题,如果是使用系统自带的输入法,输入英文是没问题的,但是输入中文却遇到了bug。输入中文,点击发送不能执行,软键盘收回,再次点击发送才能执行发送事件。而且还发现点击输入框,获得焦点,再点击输入框会失去焦点,遇到这个问题,就尴尬了!后来又拿了别的6s plus来测试,在另一台手机上发现,能够输入中文啊,经过对比发现,两个手机的输入法不同,正常点击发送的手机的输入法是第三方输入法。
那么问题就出现在这里了,苹果自带输入法对中文的一个支持问题。怎么办呢?用第三方输入法吧!

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台