event.stopPropagation()和event.preventDefault()之间的联系

news2025/1/11 7:10:21

目录

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


今天来看看前端的冒泡和事件默认事件如何处理

1.event.stopPropagation()方法

这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开,

2.event.preventDefault()方法

这是阻止默认事件的方法,调用此方法是,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素;

3.return false  ;

这个方法比较暴力,他会同事阻止事件冒泡也会阻止默认事件;写上此代码,连接不会被打开,事件也不会传递到上一层的父元素;可以理解为return false就等于同时调用了event.stopPropagation()和event.preventDefault()

4.我们来看看几组demo,使用jquery进行DOM操作

 下面来看js代码,第一种 :

第二种:

 

第三种:

 event.stopPropagation()和event.preventDefault(),还有 return false

 第四种:

第五种: 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/734294.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

数据集托管平台汇总比较

目录 引言数据集托管平台需要满足的条件:☆☆☆ Hugging Face Dataset☆☆ 魔搭平台☆ OpenDataLab总结 引言 最近考虑构建一些测试数据集评测基准,用于评测算法在数据集上的效果。不同于论文中用到的公开数据集,这里构建的数据集更有针对性…

电影天堂.

提取 最新综艺资源推荐 的电影名字和下载链接 """ 1、先从首页网址定位 2、在定位的的位置找到子页面的链接地址 3、请求子页面的链接地址,拿到我们想要的下载地址 """"""1、定位到最新综艺资源推荐""&quo…

惊!ChatGPT处理文章仅需一秒钟,提取大纲、重写不在话下!

前言 在上篇文章中,我们实现了批量抓取到微信公众号文章的链接地址,那么这篇文章将继续为大家介绍,如何根据链接爬取到文章内容,并且利用chantGPT对文章进行处理。 爬取文章内容 我们已经有了很多文章的链接,这些链…

2023全新UI 哈希玛特HashMart全开源盲盒系统源码下载

ashMart(哈希玛特)是首款开源的面向生产的高性能、易开发的盲盒系统。它包含:首页看板、商品管理、订单管理、盲盒管理、系统管理、会员管理、权限管理、记录管理,并且拥有完善的搭建使用手册和接口文档。是帮助您快速落地盲盒商城…

tarjan算法(相关概念、Tarjan求最大强连通分量、割点、求桥、缩点)

什么是连通分量 无向图 G 的最大连通子图称为 G 的连通分量。 注:这里的最大连通子图的含义为:此图为 G 的连通子图,将 G 的任意一个点加到盖子图中之后,此子图将不再连通。 比如这一张图中,很显然,我用…

如何识别网站是否有WAF

使用工具识别:wafw00f https://github.com/EnableSecurity/wafw00f 前提:本地配置好python环境安装:在此目录下创建CMD窗口,输入 python setup.py install 。安装成功后,显示版本信息. 使用:进入wafw00…

QSystemTrayIcon简单使用

效果: 关键程序: trayIcon new QSystemTrayIcon(this);trayIcon->setIcon(QIcon(":/images/开心果.png"));trayIcon->show();trayIcon->showMessage(ui->title->text(),ui->msg->toPlainText(),QIcon(":/images/睡眠…

路径规划算法:基于堆优化优化的路径规划算法- 附代码

路径规划算法:基于堆优化优化的路径规划算法- 附代码 文章目录 路径规划算法:基于堆优化优化的路径规划算法- 附代码1.算法原理1.1 环境设定1.2 约束条件1.3 适应度函数 2.算法结果3.MATLAB代码4.参考文献 摘要:本文主要介绍利用智能优化算法…

雅思考试报名条件及时间是什么时候?

雅思考试(IELTS)是国际英语语言测试系统,是著名的国际性英语标准化水平测试之一。想要出国留学或者就业都是需要有语言成绩的,其中雅思考试也是大家参加的比较多的语言考试之一,那么雅思考试报名条件及时间是什么时候呢…

为初学者准备的 Dubbo 入门教程

Dubbo Dubbo 与 RPC 的关系 Dubbo 是一种开源的分布式服务框架,由阿里巴巴公司开发。它为应用程序提供高性能的 RPC(远程过程调用)通信和服务治理能力,让应用程序能够在分布式环境中快速构建高可靠性和可扩展性的服务。Dubbo 核心…

信道的容量和复用

信道的极限容量 当信道质量比较差时,输出信号的波形难以识别,此时出现的现象称为码间串扰“ 失真的因素有:码元传输速率,信号传输距离,噪声干扰,传输媒体质量等。 奈奎斯特准则: 理想低…

18.Lucas-Kanade光流及OpenCV中的calcOpticalFlowPyrLK

文章目录 光流法介绍OpenCV中calcOpticalFlowPyrLK函数补充reference 欢迎访问个人网络日志🌹🌹知行空间🌹🌹 光流法介绍 光流描述了像素在图像中的运动,就像彗星☄划过天空中流动图像。同一个像素,随着时…

机器学习与深度学习——利用随机梯度下降算法SGD对波士顿房价数据进行线性回归

机器学习与深度学习——利用随机梯度下降算法SGD对波士顿房价数据进行线性回归 我们这次使用随机梯度下降(SGD)算法对波士顿房价数据进行线性回归的训练,给出每次迭代的权重、损失和梯度,并且绘制损失loss随着epoch变化的曲线图。…

集群 第四章

目录 1. nginx、lvs、haproxy 的区别 2. 实验 3. ssh 升级 4.总结 1. nginx、lvs、haproxy 的区别 2. 实验 Haproxy 服务器:192.168.83.101 Nginx 服务器1:192.168.83.102 Nginx 服务器2:192.168.83.103 …

Mysql之视图,索引及数据的备份与恢复

目录 一、视图 1.视图是什么 2.视图与数据表的区别 3.视图的优缺点 优点: 缺点: 4.视图的应用场景 5.语法运用 二、索引 1.什么是索引 2.为什么要使用索引 3.使用索引的优缺点 4.何时不使用索引 5.索引何时失效 6.索引分类 三、数据的备份…

头结点到底方便了啥?

头结点到底方便了啥? 链表增加头结点的作用如下: (1)便于首元结点的处理 (2)便于空表和非空表的统一处理 (参考:《数据结构 C语言(第2版)》P31) 其实这两句话很抽象,你说方便就方便,你倒是举个粟子或者画个图什么的啊&…

Linux开发工具之vim工具的使用介绍

目录 前言 1.vim的基本概念 命令模式(Normal mode) 插入模式(Insert mode) 末行模式(last line mode) 2.vim的基本操作 命令模式的命令集 移动光标 ​编辑 删除文字 复制 替换 撤销操作 更改 vim末行模式命令集 简单vim配置 总结 前言 大家好呀,许久…

Java动态规划LeetCode1137. 第 N 个泰波那契数

方法1:通过动态规划解题,这道题也是动态规划的一道很好的入门题,因为比较简单和容易理解。 代码如下: public int tribonacci(int n) {//处理特殊情况if(n0){return 0;}if(n1||n2){return 1;}//定义数组int[]dpnew int[n1];//初…

浏览器通过js打开文件,新建文件,静默实时保存文件

资源&#xff0c;点击下载 在线访问Txt Markdown &#x1f61d;&#x1f61d;&#x1f61d;&#x1f61d;&#x1f61d;&#x1f61d; 新建文件后&#xff0c;可以直接保存文件&#xff0c;不需要再次下载文件&#xff0c;也只有第一次保存时候才会出现确认弹窗 html <!D…

尚硅谷React学习笔记(上)

目录 一、React入门 1.1、React简介 为什么要学&#xff1f; React的特点 1.2、React的基本使用 Hello React案例 创建虚拟DOM的两种方式 虚拟DOM与真实DOM 1.3、React JSX 语法规则 JSX小练习 1.4、模块与组件化的理解 模块 组件 模块化 组件化 二、React面向…