收藏
回答

页面滚动期间的 tap 事件不会触发

问题模块 框架类型 问题类型 终端类型 微信版本 基础库版本
框架 小程序 Bug 客户端 all all

手指滑动 -> 页面滚动 -> 手指离开页面 -> 页面处于惯性滑动 -> 在这个时间点击页面固定元素


期待:触发固定元素的绑定事件

实际:页面滚动停止,并未触发事件


无法触发固定元素的绑定事件。  比如我有一个  fixed 的 导航,在页面处于惯性滑动时候,点击导航链接是无法跳转的,而是会停止页面滚动,这对于正常页面,是一个符合预期的反应。但对于不滚动的元素(position:fixed)无法触发 tap 事件就不符合直觉了。下面是简单的代码片段


wechatide://minicode/aF61XNm5722E


称上面的为情况一, 另外,还有一个更厉害的情况二


我原以为 fixed 的元素也属于整个 page, 正在滚动的是 page, 那么点击 fixed 的元素自然也算点击了 page,此时的反应为:页面停止滚动;从逻辑上讲也是算说的通,只是没那么完美


那么 我用一个 scroll-view 来滚动,  fixed 元素也成为了与 scroll-view 同级元素了,那么 scrool-view 还处于惯性滑动期间,我点击 scroll-view 内部的元素会停止 scrool-view 的滚动(实际也是如此)。若点击与 scroll-view 同级的 fixed 元素就会触发 tap 事件了吧,事实更刺激:没有任何反应,scroll-view 不会停止,继续着惯性滑动,tap 事件也不响应,直到 scroll-view 的惯性滑动结束后,点击 fixed 元素才会触发事件 。就是说 scroll-view 只要在滚动,点击 scroll-view 同级别的其他元素,就无法触发事件


上面说的都是针对 tap 事件,实测发现,touchstart 事件,情况一仍然不触发,情况二却可以触发 :)


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

10 个回答

  • 是柿子啊
    是柿子啊
    2018-09-29

    目前在你所提供的代码片段中,是描述的页面在滑动未结束的时候,点击页面的时候,滚动会停止,点击没有事件绑定的时候同样会停止的,同时在页面活动的时候是会阻塞其余的事件,至于你说提到的情况二,麻烦提供下相关的代码片段

    2018-09-29
    赞同
    回复 3
    • Rainbow*_*^@^
      Rainbow*_*^@^
      2018-12-28

      我也遇到了同样的问题,当scroll-view处于滑动期间时,无法触发页面其他元素的tap事件;按照你的回复,是因为页面活动的时候阻塞了其余的事件,有什么办法解除阻塞吗?

      2018-12-28
      赞同
      回复
    • macho
      macho
      06-14回复Rainbow*_*^@^

      请问这个问题你解决了吗?是怎么解决的,希望收到你的回复

      06-14
      赞同
      回复
    • Rainbow*_*^@^
      Rainbow*_*^@^
      07-09回复macho

      不好意思,没有解决。。。

      07-09
      赞同
      回复
  • 马六甲
    马六甲
    2018-09-29

    就说情况一,  请问一下, 在页面还处在惯性滚动的时间点, 点击一个绑定了事件的 fixed 元素,仅是停止页面的惯性滚动,而不触发事件,是否合理?


    比如我要做一个自定义的 tabBar,这样的体验就会很差




    情况二,我以为已经描述的够清楚了,稍微提供一下代码



    ---------------------------------


    想不到只能回复一次,只能重新编辑了,情况二代码


    wechatide://minicode/DBhsyNmR7c2w



    -------------------------------------------

    9-30号再次更新, 话说,你们交流社区的官方人员是不是有什么类似于 “消灭零回复”的 KPI任务,

    回答问题基本都是索要代码片段,然后就置之不理了,是因为完成了 KPI?


    搞笑的吧,为了复现,前后花了好几个钟头给你们反馈,就这么敷衍一下子么


    2018-09-29
    赞同
    回复 4
    • 是柿子啊
      是柿子啊
      2018-12-28

      你没有在我留言下回复,我这边是看不到提醒,问题这边先看下

      2018-12-28
      赞同
      回复
    • Rainbow*_*^@^
      Rainbow*_*^@^
      2018-12-28回复是柿子啊

      可是我回复了,为什么不回复我呢?

      2018-12-28
      赞同
      回复
    • 是柿子啊
      是柿子啊
      2018-12-28回复Rainbow*_*^@^

      我。。。,同类问题哈,你可关注下问题哈

      2018-12-28
      赞同
      回复
    • Rainbow*_*^@^
      Rainbow*_*^@^
      2018-12-28回复是柿子啊

      嗯嗯。。。等待你们的回复。。

      2018-12-28
      赞同
      回复
  • 浊
    18小时前

    一转眼半年多过去了,有后续吗

    18小时前
    赞同
    回复