如何解决滑动翻页与移动端click事件冲突问题？

本文共计1762个文字，预计阅读时间需要8分钟。

前言：本文内容简短。主要内容是探讨由于移动端click事件和js事件机制导致的点击问题。以下是具体分析和解决方案。

前述

本文很短~
主要是为了总结和讲述移动端click和js事件机制导致的一个问题。
（：咳咳，其实几句话就能写完的还要水一篇文章，不愧是我…

正文

最近做了一个小活动，里面要用到一个效果：滑动翻页。大概是这样的：

<!-- HTML代码 --> <div class="page-container"> <div class="page" style="background: #dc3b26">1</div> <div class="page" style="background: #f3b03d">2</div> <div class="page" style="background: #44a2f8">3</div> </div>

在css中，首先因为是滑动翻页，所以我们要保证“始终只有一屏”，这个可以放在全局样式表里控制，然后是其中的“每一页”都要占满父元素 —— 这里其实用了“div是块元素，无外力情况下竖直排列”的特性。