html输入两次自动弹框,html页面中的输入框点击后，被弹出的输入法遮住了。

html页面中的输入框点击后，被弹出的输入法遮住了

使用了scrollIntoView，iOS上可以生效，安卓上没作用，代码如下

相关代码

html, body {

height: 100%;

padding: 0;

margin: 0;

}

header {

position: fixed;

top: 0;

left: 0;

z-index: 9999;

width: 100%;

height: 50px;

line-height: 50px;

font-size: 18px;

text-align: center;

background: #ccc;

}

main {

position: absolute;

top: 50px;

bottom: 10px;

left: 20px;

width: 100%;

margin-bottom: 50px;

/* 使之可以滚动 */

overflow-y: scroll;

/* 增加该属性，可以增加弹性，是滑动更加顺畅 */

-webkit-overflow-scrolling: touch;

}

footer {

position: absolute;

bottom: 0;

left: 0;

width: 100%;

height: 50px;

line-height: 50px;

text-align: center;

background: #666;

border-top: 1px solid #e6e6e6;

}

footer input {

display: inline-block;

width: 90%;

height: 20px;

font-size: 14px;

outline: none;

border: 1px solid #e6e6e6;

border-radius: 5px;

}

This is the header

Welcome to

• Today
• is
• Sunday
• And
• I
• have
• to
• go
• to
• work
• tomorrow
• Today
• is
• Sunday
• And
• I
• have
• to
• go
• to
• work
• tomorrow

$(function() {

$('input').on('click', function () {

var target = this;

// 使用定时器是为了让输入框上滑时更加自然

setTimeout(function(){

target.scrollIntoView(true);

},100);

});

})