js事件之event.preventDefault()与event.stopPropagation()用法区别

event.preventDefault()用法介绍

该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作)。例如,如果 type 属性是 "submit",在事件传播的任意阶段可以调用任意的事件句柄,通过调用该方法,可以阻止提交表单。注意,如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作。无论哪种情况,调用该方法都没有作用。

该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作)。

例如,如果 type 属性是 "submit",在事件传播的任意阶段可以调用任意的事件句柄,通过调用该方法,可以阻止提交表单。

注意,如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作。无论哪种情况,调用该方法都没有作用。

event.stopPropagation()用法介绍

该方法将停止事件的传播,阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意,虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用,但是它可以阻止把事件分派到其他节点

该方法将停止事件的传播,阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。

注意:虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用,但是它可以阻止把事件分派到其他节点。

event是DOM的事件方法,所以不是单独使用,比如指定DOM

时间: 2024-10-12 22:21:42

js事件之event.preventDefault()与event.stopPropagation()用法区别的相关文章

阻止JS事件冒泡传递(cancelBubble 、stopPropagation)

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Test.WebForm1" %> <!DOCTYPE html><html><head><title> 阻止JS事件冒泡传递(cancelBubble .stopPropagation)</

js事件之event.preventDefault()与(www.111cn.net)event.stopPropagation()用法区别

event.preventDefault()用法介绍 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "submit",在事件传播的任意阶段可以调用任意的事件句柄,通过调用该方法,可以阻止提交表单.注意,如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作.无论哪种情况,调用该方法都没有作用. 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作

JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时候,如果点击一个连接,这个连接仍然会被打开. 二.event.preventDefault() 阻止默认事件的方法,调用此方法时,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素: 三.return false: 这个方法比较暴力,会同时阻止事件冒泡也会阻止默认事件:写上此代码,连接不会被

关于js中return false、event.preventDefault()和event.stopPropagation()

在平时项目中,如果遇到需要阻止浏览器默认行为,大家经常会用return false;和event.preventDefault()来阻止,但对它俩的区别还是有些一知半解,于是看了文档,查了些资料,在此总结下它俩的区别,顺便带上event.stopPropagation()一起区分下. 一.原生js中: 关于return false和preventDefault: 在W3C Document Object Model Events Specification1.3版本中提到过: The Event

阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, 2.event.preventDefault()方法 这是阻止默认事件的方法,调用此方法是,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素: 3.return false  : 这个方法比较暴力,他会同事阻止事件冒泡也会阻止默认事件:写上此代

js原生ajax与jquery的ajax的用法区别

什么是ajax和原理? AJAX 是一种用于创建快速动态网页的技术. 通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据 XMLHttpRequest对象的基本属性: onreadtstatechange 每次状态改变所触发事件的时间处理程序. responseText 从服务器响应返回以字符串为形式的数据 responseXML 从服务器响应返回以XML(DOM兼容文档)数据对象 status 从服务器返回的数字代码 100-199 用于指定客户端应相应的某些动作. 2

js事件中的event对象

addEvent(oDiv,"click",function(event){ console.log(event.bubbles+"事件是否冒泡"); console.log(event.cancelable +"是否可以取消默认行为") console.log(event.defaultPrevented+"DOM3新增,是否已经调用了preventDefault()"); console.log(event.target)

JS 事件(3)——事件对象

事件对象 在触发DOM节点上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息. DOM中的事件对象 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>事件对象</title> 6 </head> 7 <body> 8 <div id="box"&

JS 事件(4)——跨浏览器的事件对象

跨浏览器的事件对象详解 封装事件对象 1 var event_util = { 2 //添加事件 3 addHandler: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 element.attachEvent("on" +