• 安卓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);//失焦后强制让页面归位 }); }

    至此问题解决了;

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

  • 相关阅读:
    数据解析1127
    数据解析1119
    数据解析1114
    数据解析1122
    数据解析1121
    数据解析1120
    数据解析1116
    数据解析1128
    Twitter惊现新型病毒 每分钟159条速率分散
    宏达电预计本年有望在台湾市场击败诺基亚
  • 原文地址:https://www.cnblogs.com/yeziyou/p/13684973.html
Copyright © 2020-2023  润新知