移动端 由于软键盘导致页面布局错乱的解决方案

//变量声明 player_id_name(弹出软键盘的input标签、id标签)
//iframe-cz(遮罩层元素里的弹窗div、class标签)
----------------------------------------------------
var html = document.getElementsByTagName('html')[0];
html.style.height = html.clientHeight + 'px';
var input = document.getElementById('player_id_name'), timer;
input.addEventListener('focus', function(e) {
    timer = setInterval(() => {
                input.scrollIntoView(false);
}, 200)
}, false)
input.addEventListener('blur', function(e) {
    clearInterval(timer);
    timer = null;
}, false)
-----------------------------------------------------
//如果是遮罩层弹窗里面出现软键盘的情况 那么需要加上
$("#player_id_name").bind('focus', function () {
    $('.iframe-cz').css('position', 'absolute');
})
$("#player_id_name").bind('blur', function () {
    $('.iframe-cz').css({ 'position': 'fixed', 'bottom': '0' });
})