angular.js - 在移动端web上如何解决输入法挡住文本框问题?
问题描述
在移动端web页面内定义了一个比较大的textarea大概能显示15行字,点击textarea的时候,输入法弹出来会遮住textarea下端的几行字,导致输入的字数到10行之后,后面的输入的字都被输入法挡住了,变成了盲打,体验很差。
请问使用js有什么方法可以解决这种问题?
刚刚写了个比较笨的方法,发现只有三星的手机以及android5.0能兼容,什么小米,vivo之类的乱七八糟的机子都不认这个方法,醉了。。
<textarea onfocus='textfocus(this)' onblur='textblur(this)' rows='' cols=''></textarea><script type=’text/javascript’> function textfocus(o){ o.style.position = ’fixed’; o.style.top = ’50px’; o.style.zIndex = ’999’; } function textblur(o){ o.style.position = ’static’; o.style.top = ’auto’; } </script>
问题解答
回答1:1.当textarea接收到focus事件时,自动将文本框滚动到屏幕顶端2.设计的输入框不要超过半个屏幕,如果一定要超过,textarea有change事件,计算输入了多少个字,相应的再把输入框向上滚动
这样应该就能很友好了
回答2:使用fixed定位,bottom
相关文章:
1. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法(标题说不太清楚,请见题内描述)2. javascript - 如何保证数据库里的信息安全?3. python 中对redis 操作采用装饰器进行处理,怎么做4. Python 中如何对单个字典中同一个 key 的值进行合并?5. html5 - vue-cli 装好了 新建项目的好了,找不到项目是怎么回事?6. javascript - js判断一个数组是否重复7. javascript - 责任具体在哪一方8. 微信小程序如何加载h5页面9. javascript - vue2.0中使用vue2-dropzone的demo,vue2-dropzone的github网址是什么??百度不到。10. javascript - IOS没有上APP Store如何实现热更新?