在移动端web上如何解决输入法挡住文本框问题？

Question

在移动端web页面内定义了一个比较大的textarea大概能显示15行字，点击textarea的时候，输入法弹出来会遮住textarea下端的几行字，导致输入的字数到10行之后，后面的输入的字都被输入法挡住了，变成了盲打，体验很差。

请问使用js有什么方法可以解决这种问题？

刚刚写了个比较笨的方法，发现只有三星的手机以及android5.0能兼容，什么小米，vivo之类的乱七八糟的机子都不认这个方法，醉了。。

<textarea class="form_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>

Answer 1

1.当textarea接收到focus事件时，自动将文本框滚动到屏幕顶端
2.设计的输入框不要超过半个屏幕，如果一定要超过，textarea有change事件，计算输入了多少个字，相应的再把输入框向上滚动

这样应该就能很友好了

Answer 2

使用fixed定位，bottom