on绑定阻止冒泡失败

使用zepto库，有如下dom

1 <div id="J_parent">
2         <a href="#">
3             <span>点我有惊喜</span>
4         </a>
5 </div>    

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

1 $(‘#J_parent‘).on(‘tap‘,  ‘span‘, function(e){
2     e.preventDefault();
3     e.stopPropagation();
4     console.log(‘span‘);
5 });
6
7 $(‘#J_parent‘).on(‘tap‘,  ‘a‘, function(e){
8     console.log(‘a‘);
9 });

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

‘span‘

‘a‘

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

1 $(‘#J_parent‘).on(‘tap‘,  ‘a‘, function(e){
2     if(e.target.nodeName == ‘SPAN‘){
3         return;
4     }
5     console.log(‘a‘);
6 });

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

‘span‘

ps:

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

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

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