• iso移动端input的bug解决(vue)


    iso中input很奇怪,点击空白地方,键盘也不会消失,影响页面中其他功能

    解决办法: 点击的元素不是input或者textarea,那么就让上一个获得焦点的输入框失去焦点。

    涉及的代码:

    <input type="tel" @focus="isohide($event)">

    var iso = false;
    var nowinput = null;
    var browser={
    versions:function(){
    var u = navigator.userAgent, app = navigator.appVersion;
    return {
    ios: !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
    };
    }(),
    language:(navigator.browserLanguage || navigator.language).toLowerCase()
    };
    if(browser.versions.ios){
    iso = true;
    }
    function docTouchend (event){
    if (!(event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA')) {
    setTimeout(function(){
    nowinput.blur();
    window.scrollBy(0,10); // 解决失去焦点后,苹果的页面窗口可能卡住,让滚动条滚动一点即可。
    document.removeEventListener('touchend', docTouchend,false);
    }, 300);
    }
    };

    vue中methods
    methods: {
     isohide: function (e) {
    if (iso) {
    nowinput = e.target;
    document.addEventListener("touchend", docTouchend, false);
    }
    }
    }
  • 相关阅读:
    5-最长回文子串
    String、StringBuffer和StringBuilder的区别(转载)
    LeetCode31题,下一个排列
    BindingResult
    @Validated 和 @Valid
    springboot Filter Interceptor
    @ReponseStatus
    ResponseEntity
    springboot 异常处理机制源码分析
    @RequestMapping的produces作用
  • 原文地址:https://www.cnblogs.com/sgqwjr/p/10207629.html
Copyright © 2020-2023  润新知