• 解决h5在ios 微信中 input框键盘收起 页面底部留白


    ; (function (window, document) {
        var browser = {
            info: (function () {
                var u = navigator.userAgent;
                return {
                    trident: u.indexOf('Trident') > -1,
                    presto: u.indexOf('Presto') > -1,
                    webKit: u.indexOf('AppleWebKit') > -1,
                    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,
                    mobile: !!u.match(/AppleWebKit.*Mobile.*/),
                    ios: !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/),
                    android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1,
                    iPhone: u.indexOf('iPhone') > -1,
                    iPad: u.indexOf('iPad') > -1,
                    webApp: u.indexOf('Safari') == -1,
                    weixin: u.indexOf('MicroMessenger') > -1,
                    weixinVersion:
                      u.match(/MicroMessenger/([d.]+)/i) &&
                      u.match(/MicroMessenger/([d.]+)/i)[1],
                    qq: u.match(/sQQ/i) == ' qq',
                    isAppIos: u.match(/auto_iphone/i),
                    isIos12: !!u
                      .toLowerCase()
                      .match(/cpu iphone os 12_d[_d]* like mac os/)
                }
            })(),
            language: (navigator.browserLanguage || navigator.language).toLowerCase()
        };
        // 页面晃动
        function shake() {
            var oPadding = document.defaultView.getComputedStyle(document.body, 'paddingTop');
            var pTopVal = '';
            if (document.defaultView && document.defaultView.getComputedStyle) {
                pTopVal = oPadding['paddingTop'] || ''
            }
            if (pTopVal) {
                document.body.style.paddingTop = "3px";
                setTimeout(function () {
                    if (pTopVal && pTopVal !== '3px') {
                        document.body.style.paddingTop = pTopVal
                    } else {
                        document.body.style.paddingTop = ""
                    }
                }, 400)
            } else {
                document.body.style.paddingTop = "3px";
                setTimeout(function () {
                    document.body.style.paddingTop = ""
                }, 400)
            }
            _resetScrollTop()
        }
        function _resetScrollTop() {
            var y = window.pageYOffset || window.scrollTop || document.documentElement.scrollTop || document.body.scrollTop
            var distance = 2
            var topVal = y
            if (y > 0) {
                topVal = y - distance
                topVal = topVal < 0 ? 0 : topVal
            } else {
                topVal += distance
            }
            document.documentElement.scrollTop = topVal
            setTimeout(function () {
                document.documentElement.scrollTop = y
            }, 400);
        }
        // 发送消息 【iframe 父页面】
        function emitShake() {
            window.top && window.top.postMessage && window.top.postMessage('dlrformshake', '*');
        }
        // 监听消息 [iframe 子页面]
        function addMessageListner() {
            window.addEventListener('message', function (e) {
                if (e.data === 'dlrformshake') {
                    shake()
                }
            })
        }
    
        var _el = null
        function blurHandler() {
            if (_el && _el.scrollIntoView) {
                _el.scrollIntoViewIfNeeded ? _el.scrollIntoViewIfNeeded() : _el.scrollIntoView()
            }
            shake()
            emitShake()
        }
    
    
        function fixformMisplace() {
            function _clickHandler(e) {
                _el = null
                var el = e.target || e.srcElement;
                if (el.nodeName.toLowerCase() === 'input' || el.nodeName.toLowerCase() === 'textarea' || el.nodeName.toLowerCase() === 'select') {
                    if (!_checkEl(el)) { // checkbox readio submit
                        return
                    }
                    _el = el
                    el.removeEventListener('blur', blurHandler)
                    el.addEventListener('blur', blurHandler, false)
                    _regFormAll()
                }
            }
            function _checkEl(el) {
                if (el.nodeName.toLowerCase() === 'input' && /checkbox|radio|submit/gi.test(el.getAttribute('type'))) { // checkbox readio submit
                    return false
                }
                return true
            }
            function _regFormAll() { // 对表单其它input 再次注册
                var els = document.querySelectorAll('input,textarea,select')
                for (var i = 0; i < els.length; i++) {
                    var el = els[i]
                    if (_checkEl(el)) {
                    }
                }
            }
            var context = document.body || document.documentElement;
            context.removeEventListener('click', _clickHandler);
            context.addEventListener('click', _clickHandler, false)
            addMessageListner() // iframe 父页面注册监听消息事件
        }
    
        if (browser.info.mobile && browser.info.ios && (browser.info.weixin || (browser.info.isAppIos))) {
            _formFixInvoke()
        }
    
        function _formFixInvoke() {
            document.addEventListener('DOMContentLoaded', function () {
                if (!window.__isReg__fixformMisplace) {
                    fixformMisplace()
                    window.__isReg__fixformMisplace = true
                }
            }, false)
    
            if (document) {
                if (document.documentElement || document.body) {
                    setTimeout(function () {
                        if (!window.__isReg__fixformMisplace) {
                            fixformMisplace()
                            window.__isReg__fixformMisplace = true
                        }
                    }, 60)
                }
            }
        }
    })(window, window.document)

  • 相关阅读:
    MKMapVIew学习系列2 在地图上绘制出你运行的轨迹
    WPF SDK研究 Intro(6) WordGame1
    WPF SDK研究 Intro(3) QuickStart3
    WPF SDK研究 Layout(1) Grid
    WPF SDK研究 目录 前言
    WPF SDK研究 Intro(7) WordGame2
    WPF SDK研究 Layout(2) GridComplex
    对vs2005创建的WPF模板分析
    WPF SDK研究 Intro(4) QuickStart4
    《Programming WPF》翻译 第6章 资源
  • 原文地址:https://www.cnblogs.com/codeon/p/13445239.html
Copyright © 2020-2023  润新知