天天看点

js事件冒泡、阻止事件冒泡以及阻止默认行为

事件冒泡

当事件发生后,这个事件就要开始传播(从里到外或者从外向里)。为什么要传播呢?因为事件源本身(可能)并没有处理事件的能力,即处理事件的函数(方法)并未绑定在该事件源上。例如我们点击一个按钮时,就会产生一个click事件,但这个按钮本身可能不能处理这个事件,事件必须从这个按钮传播出去,从而到达能够处理这个事件的代码中(例如我们给按钮的onclick属性赋一个函数的名字,就是让这个函数去处理该按钮的click事件),或者按钮的父级绑定有事件函数,当该点击事件发生在按钮上,按钮本身并无处理事件函数,则传播到父级去处理。

PS:这是百度百科的内容   举个栗子: <div><a>点击这里</a></div>

当你点击a标签的时候 同时也就点击了他的父级元素  会先触发a绑定的单击事件 然后触发父级元素的单击事件,但是有些时候我们只想触发子元素的事件,不想要事件扩散,这就需要  阻止事件冒泡

function propagation(ev){
    var oEvent = ev || event;
    //js阻止事件冒泡
    oEvent.cancelBubble = true;
    oEvent.stopPropagation();

   //js阻止默认行为
   oEvent.preventDefault(); 
   return false;
           
   //既阻止冒泡 也阻止默认行为
   return false;      

}