安卓input闪烁问题解决

在最近的开发中遇到个问题；

安卓机 在微信端光标移动输入框 placeholder=“请输入车主名称” 这提示字会闪烁，页面出现抖动问题；

找了很多资料，应该是浏览器的问题，在谷歌中是合适的。

而苹果机不存在这个问题；

苹果机在软键盘打开的时候，底部有fixed定位的button等元素会被提起来，造成部分图片变形；

故：

//判断手机是Android还是ios

if (/Android/gi.test(navigator.userAgent)) {
            var winHeight = $(window).height();   //获取当前页面高度
            window.addEventListener('resize', () => {
                var newInnerHeight = window.innerHeight;
                if (innerHeight >newInnerHeight) {
　　　　　　　　　　　　//软键盘弹出事件
                    console.log("软键盘弹出事件")；
                } else{
　　　　　　　　　　　　//软键盘关闭事件
                    console.log("软键盘关闭事件")；
　　　　　　　　　　　　//执行方法
                    isResize()；
                }
            });
        } else {
            window.addEventListener('focusout', () => {
                // 键盘收起事件处理
                isResize()
            });
        }
        
　　　　　//当软键盘收起的时候，input，select等失去焦点，然后再让页面复位
        function isResize(){
            $(document).on('focusout', function() {
                //软键盘收起的事件处理
                var heigs = document.body.scrollHeight;
                document.body.scrollTop = heigs;
            });
            
            $("input,select").blur(function() {
                document.body.scrollTop = document.documentElement.scrollTop = 0;
                setTimeout(() => {
                    const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
                    window.scrollTo(0, Math.max(scrollHeight - 1, 0));
                }, 100);
            });
            
            $("input,select").on("blur",function(){
                window.scroll(0,0);//失焦后强制让页面归位
            });
        }                        

 

至此问题解决了；

有需要的小伙伴可以参考参考