问题:
在一个h5移动端页面中,
存在这样父子关系:上下滑动元素=>左右滑动元素=>点击元素
如果这个页面中存在上下滑动(下拉刷新) 、左右滑动(轮播切换)以及点击事件(轮播item内容点击后跳转对应页面)的时候,手势在轮播区域交互的话,三个事件都会同时触发(发生冲突).
尝试过的解决方法:
1、阻止冒泡
假如我在轮播的左右滑动元素里加入阻止向上冒泡,防止滑动的时候冒泡到父级触发上下滑动,会出现只能触发左右元素,而无法触发上下滑动了,希望的是左右滑动的时候才不去触发上下滑动,而不是在左右滑动的元素里永远都不能上下滑动
2、阻止捕获
假如我在轮播的左右滑动元素里加入阻止向下捕获,那么 点击事件元素永远都不会触发点击事件
示例说明图:
问题求解:如何让三者事件保持独立 互相不影响
这三个事件本来都是独立的触发条件 不会互相影响 难道既能向下又能向右?那就是斜着滑 斜着滑要有一个角度判定是斜着向下还是斜着向右
你的事件是怎么写的 自己写的还是用的框架