iscroll在谷歌cp端下面的差异

发布于 2022-09-06 00:22:41 字数 1441 浏览 20 评论 0

本来打算在iscroll中增加swiper实现轮播,但在chrome cp端下却不能滑动(火狐、ie、uc正常)。

后发现iscroll中的元素在chrome cp端不能触发mouseup等鼠标事件,不知道是什么原因。

jsbin效果

// html部分
  <div class="wrap">
    <div class="scroll">
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
    </div>
  </div>

// js部分
const myScroll = new IScroll('.wrap')
const item = document.querySelector('.item')

// 点击第一个元素
item.onclick = e => {
  console.log('item clicked') // 正常输出
}

item.onmouseup = e => {
  console.log('item mouseup') // 在chrome cp端下没有输出
}

希望小伙伴能解惑~谢谢~


目前的思路:

issues

// iscroll.js
{
    disablePointer : !utils.hasPointer, // 判断是否支持PointerEvent
    disableTouch : utils.hasPointer || !utils.hasTouch,
    disableMouse : utils.hasPointer || utils.hasTouch,
}

在谷歌浏览器支持PointerEvent事件,所以使用PointerEvent事件代替mouse事件,而在PointerEvent中应该阻止了了mouse事件的发生。所以可以禁止PointerEvent事件。

{
    disablePointer: true,
    disableMouse: false,
    disableTouch: false,
}

我先这么理解,等以后在深入看看源码吧。如果哪位大哥有好的想法,感激~

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

×纯※雪 2022-09-13 00:22:41

document.querySelector():返回文档中匹配指定的选择器组的第一个元素
将mouseup和mousedown事件改为:pointerdown/pointerup
https://stackoverflow.com/que...

居里长安 2022-09-13 00:22:41

刚试了下,用右键点击能触发 onmouseup 事件,感觉像是个bug.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文