 大家好，我是super，这期话题其实是来自于我们团队以往的一些实战经历。 大家也知道，移动设备屏幕相对传统PC而言更小，用户目光焦点更集中（设备距人眼距离缩短），因此，用户可感知到很小的细节，而这些细节，往往对用户体验有着很大的影响，比如说这次聊到的点击。 “点击”遇到的问题 点击就是点一下就好了，可是到了触屏版webapp上（HTML5）想要得到与nativeapp相同的效果却不是那么容易的。 大家使用昨天话题里提到那一套方案进行处理，的确是可以达到基本的效果，但是对于用户体验来说却是存在一定问题的： 现在的移动设备，它们的共同的特点屏幕越来越大、屏幕质量越来越好，但手机屏幕越来越光滑了。这并不是坏处可以让操作更加流畅，但是从而也导致了“误”操作的提升。万一误击，用户可在未抬起手指的情况下，通过移动手指来取消当前的点击操作。 我们再来看下通用方案，当手指按下（高亮）后，手指没有按预期抬起，而在屏幕上移动了一定的距离，再抬起的时候点击事件并没有被触发（并没有新内容插入页面），但是在用户按下手指移动的过程中直到抬起手指高亮的部分始终没有改变。  点击高亮的效果本质上是为了提供给用户触摸反馈让整个界面可感知，但通用方案的反馈与实际所达到的效果存在严重差异（高亮表示触发点击，而实际效果点击并没有被触发）。 适应于触屏设备的“点击” 我们来改造下通用方案： 用户希望拖动列表，所以按下了手指后快速移动，上述方案的实现效果是：
由于用户手指的点击后快速移动，所以造成点击区域高亮后又因为用户手指的移动而消失，在手机上的效果就是高亮快速的闪了一下，而这个时候用户只想拖动一下列表而不是点击，所以这种行为既不美观也不正确。 继续改造上述方案： 
扩大适用范围 OK，大功告成？不，还差一点。在Pad等大屏幕设备上这种列表还有另外一个特点，它有默认选中项。当手指移动时取消高亮、点击了默认项时不触发。上述方案支持的还不好，所以再来升级下：  细节铸造精品，最后留给大家一些思考：  |
