on绑定阻止冒泡失败

使用zepto库，有如下dom

 <div id="J_parent">
         <a href="#">
             <span>点我有惊喜</span>
         </a>
 </div>    

以上div内的节点是后续生成的，通过on绑定事件：

 $('#J_parent').on('tap',  'span', function(e){
     e.preventDefault();
     e.stopPropagation();
     console.log('span');
 });

 $('#J_parent').on('tap',  'a', function(e){
     console.log('a');
 });

此时点击span区域，控制台会打出:

'span'

'a'

阻止冒泡失败，此时可以通过在a的绑定事件里判断e.target,如下：

 $('#J_parent').on('tap',  'a', function(e){
     if(e.target.nodeName == 'SPAN'){
         return;
     }
     console.log('a');
 });

这样点击span区域，控制台会打出:

'span'

ps:

移动网页中click较tap有延迟；

target与currentTarget的区别，如以上a的绑定事件代码中，如果点击span区域，此时e.target为span，而e.currentTarget为a。更专业的说明：

target在事件流的目标阶段；currentTarget在事件流的捕获，目标及冒泡阶段。只有当事件流处在目标阶段的时候，两个的指向才是一样的， 而当处于捕获和冒泡阶段的时候，target指向被单击的对象而currentTarget指向当前事件活动的对象（一般为父级）。