记一次使用swiper遇到的问题

需求：

在一个移动端的h5页面中，使用swiper轮播banner活动图

 

问题：

当手动拖动swiper里的图片时，手指松开，图片卡在松开的位置，不会回弹到正常位置

 

分析：

swiper回弹会触发touchEnd事件

我在swiper的on配置中绑定touchMove和touchEnd事件

发现拖动图片时，touchMove触发了，而touchEnd事件没有触发

当我点击图片时，touchEnd触发了，而且图片回到正常位置了

所以图片回到正常位置应该和touchEnd事件相关

 

原因：

审查代码发现， 页面中有个地方，在window上绑定了touchmove事件

在touchmove事件中有绑定了touchend事件

且在touchend事件中通过e.stopPropagation()，阻止touchend事件的冒泡

导致swiper上的touchEnd事件无法触发，进而导致图片无法回到正常位置

 

解决：

为了不影响之前的代码逻辑，在上述window上的touchend事件中

判断touchend的target，如果target是swiper，则不阻止冒泡