ios下按钮click事件点击穿透问题

和app进行混合开发的时候，一个页面使用h5写的，按钮上绑定click事件会触发下面图片上的a链接导致跳转，页面如图

 

 顶部是一个banner，分vr、视频、图片三部分，红框处的三个nav按钮绑定click事件使banner滚动到响应的部分，banner上有a链接用以跳转详情,nav按钮上绑定事件如下：

$(document).on("click","#banner-navBox .nav-btn",function(e){
    ...
});            

但是点击nav按钮的时候看不到banner滚动而是直接触发下面banner上的a链接发生跳转。

查阅资料发现移动端click事件的流程：touchstart -> touchend -> tap -> click。

touchend首先触发tap然后等待300ms后触发click。

想的是nav按钮绑定click事件会先触发touchend 事件，而移动端a链接的触发机制就是touchend ，所以就导致先发生了页面跳转。所以nav按钮绑定的时间改为touchend并阻止默认行为后完美解决，如下：

$(document).on("touchend","#banner-navBox .nav-btn",function(e){
    e.preventDefault();
    ...            
}