event对象的一些方法（取消冒泡，阻止默认行为）

1.event.stopPropagation()。

事件冒泡：例如这样一个结构：<li><a></a></li>，假如你在a标签上绑定了一个点击click事件，如：$("a").click(function(){alert("a"); }); 还在li标签上绑定了一个事件，如：$("li").click(function(){alert("li"); }); 如果不加event.stopPropagation()。;这一语句，结果会在alert("a");执行后再次执行alert("li")语句，因为a标签在li标签中，a标签在li标签范围中，在执行a标签上的事件后会执行li标签上的相同类型事件，从内层标签往外层依次执行相同类型事件，从里面往外面，此为冒泡。

2.event.preventDefault()是阻止默认行为啊！！

比如一个button放在一个form中，这个button的Default就是提交（submit），但如果你不想让他提交，就可以用e.preventDefault();

打个比方：

$(document).ready(function(){

$("button").click(function(e){

$("#show").fadeTo("fast",0);

e.preventDefault();

});

}

在一个form里有button，还有一个id=show的div（上点颜色），你可以保留e.preventDefault();和去掉e.preventDefault();试试看，效果不同的。

event对象的一些方法（取消冒泡，阻止默认行为）相关推荐

JavaScript事件——event对象事件冒泡阻止默认行为事件捕获
event对象用来获取事物的详细信息:鼠标位置.键盘按键 e.clientX 鼠标距离元素所在的X轴(左边)位置 e.clientY 鼠标距离元素所在的Y轴(顶部)位置 (左上角为0,0点) 获取e ...
vue中阻止冒泡阻止默认行为
1.事件冒泡:不再派发事件. 方法: event.stopPropagation()html: <button data-aid='123' @click="eventFn($even ...
vue 事件上加阻止冒泡阻止默认事件
重点 vue事件修饰符  <a v-on:click.stop="doThis"></a><!-- 提交 ...
JS 阻止冒泡阻止默认
1.什么是事件冒泡? 事件冒泡是指事件由子级传向父级,事件冒泡常常会使事件按照不属于我们原本的方式进行,影响我们正常处理事件的流程. 下边的代码通过控制台可以看出事件冒泡的流程. <body ...
js中event对象属性和方法
1.type 事件的类型,如onlick中的click: 2.srcElement/target 事件源,就是发生事件的元素: 3.button 声明被按下的鼠标键,整数,1代表左键,2代表右键,4代 ...
preventDefault() 方法取消事件的默认动作
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return false的区别
今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...
阻止事件冒泡和阻止默认事件的方法
1.event.stopPropagation()方法这是阻止事件的冒泡方法,不让事件向document上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开 ...
Vue和Js的阻止事件冒泡和阻止默认事件方法
原生js取消事件冒泡 try{e.stopPropagation();//非IE浏览器}catch(e){window.event.cancelBubble = true;//IE浏览器} 原生js阻 ...

event对象的一些方法（取消冒泡，阻止默认行为）

event对象的一些方法（取消冒泡，阻止默认行为）相关推荐

最新文章

热门文章