收藏
回答

微信ios端6.7.4版本发现又一重大bug!

- 当前 Bug 的表现(可附上截图)




- 预期表现


- 复现路径

用iphone手机在微信6.7.4版本上随便进一个有表单的h5页面试一下就可以复现

最后一次编辑于  2018-12-04  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

6 个回答

  • 社区技术运营专员-灵芝
    社区技术运营专员-灵芝
    2018-12-04

    是键盘收起后页面无法自动复位?

    2018-12-04
    赞同
    回复 2
  • grain
    grain
    03-20

    这个应该算是苹果系统的一个bug,当键盘收起后不会自动重绘body,需要手动滑动一下才能恢复正常。前端可以使用document.body.scrollIntoView()来解决。这里是scrollIntoView()的详细介绍:https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView具体代码块如下:

    // ios键盘弹起收回body不会重绘

    (/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', (e) => {

      ['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(false)

    }, true);


    03-20
    赞同 1
    回复
  • 💋琉璃.
    💋琉璃.
    2018-12-07
    可以全局监听一下 focusout 事件,毕竟不可能每个 input 里面都写一次 blur 监听,这对于以后的维护也不是很友好,而 focusout 与 blur 的不同之处是 focusout 可以冒泡。但是如果你的页面里有弹窗,那么你可能需要 setTimeout 一下。哦!页面卸载的时候记得移除监听。

    function fixScrollTop () {
      setTimeout(() => {
        document.body.scrollTop = document.body.scrollHeight
      }, 100)

    }


    window.addEventListener('focusout', fixScrollTop)


    2018-12-07
    赞同 1
    回复 1
    • 智
      05-17

      特意来感谢点赞大佬的,解决了,angular写的,谢谢!!

      05-17
      1
      回复
  • 王翊夫if
    王翊夫if
    2018-12-04

    应该是进入有 web-view 组件后拉起系统键盘或 picker 消失后会导致页面 contentSize 有变化,需要用户主动滚动页面才能恢复。


    这个是微信 6.7.4 使用 XCode10 打包后引入的系统 bug,我们会在 6.7.5 版本上线兼容逻辑,规避大部分有问题的情况。这个 bug 已经提交到苹果那边了,看他们何时会发布系统修复版本吧。

    2018-12-04
    赞同 1
    回复 4
    • Api调用师
      Api调用师
      2018-12-04

      好的

      2018-12-04
      回复
    • 王翊夫if
      王翊夫if
      2018-12-05回复Api调用师

      你们也可以尝试在页面修复一下,主动触发页面 scroll 一下就能恢复,就算微信这边发版本修复了,你们页面在其他 App 也会有类似的问题的。

      2018-12-05
      回复
    • Api调用师
      Api调用师
      2018-12-05回复王翊夫if

      好的,谢谢

      2018-12-05
      回复
    • Api调用师
      Api调用师
      05-13

      还在吗?帮我看下这个bug,谢谢。https://developers.weixin.qq.com/community/develop/doc/000e02379cc2d0ccbb88fccac54c00

      05-13
      回复
  • 李小啵
    李小啵
    2018-12-11

    上午解决的。

    判断下iOS设备。执行下面代码,用的事件委托,每次输入框或者下拉框离开焦点时,触发一下页面重绘

    inputBlur () {
      let $view = document.querySelector('.yd-scrollview');
      if (!$view) return;
      $view.setAttribute('tabIndex', 1);
      $view.addEventListener('blur', function (e) {
        if (['INPUT', 'SELECT'].indexOf(e.target.tagName) > -1) {
          document.body && (document.body.scrollTop = document.body.scrollTop);
        }
      }, true);
    },

    虽然 blur 并不能冒泡,但addEventListener第三个参数设置为true即可。

    如果是jQuery,那事件委托就更简单了

    2018-12-11
    赞同
    回复
  • 别
    2018-12-06
    $(document).ready(function(){
        (function(){
            let scroll_top = 0;
            let input_focus=false;
            $(document).on("focus","input,select,textarea",()=>{
                input_focus=true;
                scroll_top = $(document).scrollTop();
            });
            $(document).on("blur","input,select,textarea",()=>{
                input_focus=false;
                setTimeout(function(){
                    if(!input_focus){
                        $(document).scrollTop(scroll_top);
                    }
                },100);
            });
        }());
    });


    2018-12-06
    赞同
    回复