父元素上是mousedown.prevent，子元素会被携带方法，还阻止不了怎么办？

最新推荐文章于 2023-04-24 09:53:30 发布
最新推荐文章于 2023-04-24 09:53:30 发布
阅读量770 收藏
点赞数 1
文章标签： javascript html5 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_61177996/article/details/126229185
版权

使用了.stop不起作用，加阻止冒泡也不起作用 

event.preventDefault()

event.stopPropagation()

上面的方法都不起作用，经过多次尝试

找到了方法

使用@mousedown.self代替@mousedown.prevent，就可以解决子元素被携带方法的问题

这样点击子元素，父元素的方法就可以不被执行了

m0_61177996
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
父元素绑定mousedown其子元素也会默认被绑上
sw_onload的博客
03-26 1163
最近在做滑块验证，从百度上找来一个使用mousedown、onmousemove、onmouseup来实现，然后点击绑定了mousedown事件的滑块，打印出来的e.target有时候会是其里面的子元素 代码如下： 打印出来的e.target 只要鼠标碰到i标签，后面移动的就是i标签，可是这并不是我想要的，我想要移动的是slider，不是一个标签。但是mousedown本身就是这样，看了文档...
【我不熟悉的javascript】使用mousedown.stop.prevent，阻止选区消失
qq_17335549的博客
10-12 1122
使用mousedown.stop.prevent，阻止选区消失
vue 子元素捕获导致其 click 事件被父元素 mousedown 事件“屏蔽掉”的问题
纯爱枫若情的博客
07-08 3978
今天在做产品的时候，碰到一个需要添加右键菜单的功能。 本来一般碰到这种问题，都是直接找找看下有没有类似的插件，毕竟比较省心，但是缺点是，需要小小的看下代码，学下api。 但是找了一圈，弹出框有不少优秀的开源插件，但是右键菜单还真是没找到合适的啊，找到几个，用的人特别少，看了下代码，感觉还不如自己开发一个。毕竟用的 vue，写起来也不是太过于繁琐。 于是说干就干，经过一段时间的劈里啪啦的奋战，终于初...
给父元素绑定事件，触发事件event.target却是子元素
weixin_41559882的博客
08-17 1849
给父元素绑定事件，触发事件event.target却是子元素。若要拿绑定事件的初始元素，可用event.currentTarget 转载https://blog.csdn.net/yang1067155909/article/details/97273820
Three.js mousedown不触发
eevee_1的博客
11-04 341
想点击3D物体触发事件，然后进行旋转操作之后再抬起的时候也会触发click事件，因此想在鼠标按下的时候记录一下鼠标位置，click触发的时候判断位置是否相等再触发事件。 但是试了好久mousedown事件怎么都不触发，最后发现是和OrbitControls冲突了。 需要去修改OrbitControls的源码，搜索mousedown找到onMouseDown函数里的event.preventDefa...
15.mouseover和mouseenter的区别，父元素设置mouseover，子元素经过会触发
piaoliangj的博客
02-05 462
15.mouseover和mouseenter的区别——软设问题总结15.1 两个事件从中文解释看出本质的差别15.2 具体区别描述 15.1 两个事件从中文解释看出本质的差别 mouseover：鼠标经过事件 mouseenter：鼠标进入事件 15.2 具体区别描述 在使用该事件无子元素下，这两者是毫无差别的； 但在多数情况下，使用该事件的元素都是有子元素的，这就两者产生了区别。 mouseover：进入绑定该事件的元素和其子元素均会触发该事件，所以有一个重复触发，冒泡过程。其对应的离开事件 mouse
Text.MouseDown.zip
03-31
基于WPF中MVVM框架的鼠标按压事件、按压、释放、左击、右击、事件
鼠标拖动改变DIV等网页元素的大小的实现方法
08-30
鼠标拖动改变DIV等网页元素的大小的实现方法 在 Web 开发中，实现鼠标拖动改变 DIV 等网页元素的大小是非常常见的需求。下面，我们将详细介绍如何实现鼠标拖动改变 DIV 等网页元素的大小。 首先，我们需要了解 ...
Vue在chrome44偶现点击子元素事件无法冒泡的解决方法
10-15
在Vue框架中，事件冒泡是一种常见的事件处理机制，它允许事件从子元素向父元素逐级传播。在本文中，我们将探讨一个特定的问题，即在Chrome 44浏览器中，Vue应用中偶尔出现的子元素点击事件无法冒泡到父元素的问题，...
js实现拖拽元素选择和删除
10-14
如果鼠标在目标区域（`.drag-box`）内，那么元素会被放置在那里。 ```javascript document.onmousemove = function(e) { // ... } // 判断鼠标是否在需要放置的框内 function computInEle(ele, x, y) { // ... }...
点击子元素事件不触发父元素事件
05-12
点击子元素，触发子元素事件的同时不触发父元素的时间
Draggable Elements 元素拖拽功能实现代码
10-28
在JavaScript中，实现元素拖拽（Draggable Elements）功能是一项常见的任务，特别是在创建交互式用户界面时。这个功能可以通过原生的DOM事件处理程序或使用第三方库如jQuery UI、Interact.js等轻松实现。不过，为了...
js实现触发子元素事件，而不触发父元素事件
热门推荐
一条鱼
04-17 1万+
在这之前，我们先了解一下DOM的事件对象：preventDefault() 取消事件的默认行为stopPropagation() 取消事件冒泡对当前节点无影响cancelBubble() 取消事件冒泡DOM事件处理有三个阶段：捕捉阶段（capture phase）：从最上层元素，直到最下层（你点击的那个target）元素。路过的所有节点都可以捕捉到该事件。命中阶段（target phase）：如果...
Vue @click.stop 与 @mousewheel.prevent
走在搬砖的路上！
07-12 610
@click.stop 点击子标签不需要触发父标签的事件 <div @click="tempClick"> <div @click.stop="subTempClick"></div> </div> 盖上遮罩之后不需要下面内容支持滚动 @mousewheel.prevent 表示添加了这个修饰符的标签以下的标签内容无法接受滚动事件 <div class="mask"></div> <div class="content".
在vue中盒子大小由两个控件来拖拽调整的代码，其中一个控件负责宽度，另一个负责高度
l10103的博客
04-24 474
【代码】在vue中盒子大小由两个控件来拖拽调整的代码，其中一个控件负责宽度，另一个负责高度。
关于 Element-ui Dialog 引用时，在弹窗上 mousedown 后再在遮罩层 mouseup 引发的意外弹窗关闭问题的处理方案
qq_37750365的博客
11-27 1257
问题： Element-UI 作为当前较为成熟的 Vue 框架的 UI 组件，能有效的提高特异性不强的项目的界面开发。但是，作为一个要兼备处理多方面问题的第三方库，Element-UI 也存在着一些问题。比如 <el-dialog>。 在引用 <el-dialog> 时，尤其是将其作为编辑弹窗时，常常会有一个问题，便是在使用鼠标滑动选取弹窗中做文本选择时，若不注意将光标滑到弹窗窗体之外的遮罩层处，此时松开鼠标，就会导致弹窗被关闭掉的现象，十分影响使用体验。 当然，这种情况也有一
Vue事件修饰符都在这里啦
偷只猫来养的博客
08-19 475
Vue事件修饰符 （1）.lazy：用于将绑定input框的input事件改为change事件 （2）.self：对冒泡事件来说，设置了.self时，移入当前元素的子元素不会冒泡到当前元素，但是移入到子元素的子元素时会继续冒泡到子元素，总结来说就是：用于捕获冒泡，即有冒泡发生时，有该修饰符的dom元素会先执行，如果有多个，从外到内依次执行，然后再按自然顺序执行触发的事件；对设置了self的本身也是具有冒泡性质的 <!--设置一个时，移入子元素不会冒泡到当前元素，但是移入到子元素的子元素会冒泡到当前元素
Vue input的blur事件影响下拉框中点击事件的解决方案 用mousedown/mousedown替代click
真爱一生的博客
01-12 701
input blur
html注释代码是什乄1 7,index.html
weixin_39891694的博客
06-18 457
...content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">window.yluiVersion = '2.1.9';document.write('');document.write('');document.write('');...0...
fabric.js 判断是否点击的是canvas中某个元素的子元素
最新发布
09-25
在上面的示例中，我们创建了一个父元素rect1和一个子元素rect2，然后把子元素添加到父元素上，并将父元素添加到canvas上。当点击canvas时，如果点击的是子元素rect2，那么控制台会输出"点击的是元素的子元素"；如果...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值