阻止事件冒泡,阻止默认事件

阻止事件冒泡

html代码:

<table>
  <tr>
    <td><span>冒泡事件测试</span></td>
  </tr>
</table>

js代码:

$('table').click(function(){
    alert('table');
});
$('td').click(function(){
    alert('td');
});
$('span').click(function(e){
    alert('span');
    e.stopPropagation(); //阻止事件冒泡
});

如果js中不加“ e.stopPropagation()”,那输出结果就依次为span -> td -> table。这就叫事件冒泡。就是从下到上,从里到外,事件依次触发。


阻止默认事件-1

html代码:

<a class="a1" href="#">阻止默认事件1</a>

js代码:

$('.a1').click(function(e){
    alert('默认事件被阻止了');
    e.preventDefault(); //阻止默认事件
});

 


 

阻止默认事件-2

<a class="a2" href="javascript:void(0);" onClick="alert('a2被点击了');">阻止默认事件2</a>

 


 

阻止默认事件-3

<a class="a3" href="javascript:void(alert('a3被点击了'));">阻止默认事件3</a>

 

posted @ 2015-09-02 16:45  shirliey  阅读(...)  评论(... 编辑 收藏