addEventlistener不生效，已经执行了注册，但是事件没有注册成功

最新推荐文章于 2024-05-29 16:21:30 发布
最新推荐文章于 2024-05-29 16:21:30 发布
阅读量1.6w 收藏 2
点赞数 1
分类专栏： vue 文章标签： addEventlistener vue template
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lqyygyss/article/details/82012311
版权

浏览器强刷的时候，有时候明明代码已经执行了addEventlistener，但是在chrome上的event listener就是没有看到注册的，自然也不会响应事件

 

重点，有时候可以有时候不可以。

后来发现是vue的原因，由于使用了vue的单文件组件，template里面的模板替换掉了html上的vue的el节点。

所以实际上是有时候注册了事件，但是又被vue的模板重新替换掉了注册位置的节点。自然事件不生效了。

偶然性是因为取决于addEventlistener和vue的实例化的先后顺序

 

程序me
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
专栏目录
滚动时回显白色导航，以及vue 解决window.addEventListener失效问题
weixin_55648290的博客
11-01 2092
1.在最大的盒子加ref=" " 2.在生命周期函数mouted()中写 以上可解决在vue中window.addEventListener失效问题。 以下是回显白色导航 1.两个状态，一是默认的返回按钮，二是回显的白色背景导航。白色导航使用的是vant组件库里面的吸顶。 2.在方法里面决定二者的显示与隐藏 ...
JavaScript 注册事件代码
10-28
但是，`attachEvent`和`addEventListener`还有一个区别：`addEventListener`可以添加多个同名事件处理函数，而`attachEvent`中的事件处理函数会按照添加顺序依次执行。因此，使用`addEventListener`时，不必担心覆盖...
vue自学,window.addEventListener不生效解决方案
yrldjsbk的博客
02-25 6963
自己的代码里写的时候，多了一个小括号，导致代码不生效。百度反复查询了各种解决方案，最终，在对比网友的解决方案时候，注意到了这个细节，发现网友的方法调用，也是不带小括号的。我去掉括号后，代码生效了。最近在网上跟着别人的教程视频自学vue，在给window对象添加监听事件后，发现起初，一直没有效果。找不到原因，比较困惑。如图，出现了 这个脚本的图标，点击，就会回到页面的顶部，大于400像素后会出现，小于400像素是不会出现的。如图，这是自定义一个判定，要不要显示该图标的代码。如图，这是老师视频里面的截图代码。
window.addEventListener在部分安卓手机不生效
weixin_56006480的博客
05-26 2152
事件的默认行为，导致无法正确触发滚动事件。可以尝试在事件处理函数中调用。可能会存在一些问题，主要是因为安卓手机浏览器的兼容性问题。安卓手机上的一些浏览器可能会阻止。，这个选项用来指定是否允许调用。方法传递了一个选项对象。在上面的代码中，我们给。
window.addEventListener 用法
最新发布
ivan5277的博客
05-29 1776
是JavaScript中用来为DOM元素（在本例中是浏览器窗口window）添加事件监听器的方法。这对于响应用户操作（如点击、滚动等）或页面/浏览器的特定状态变化非常有用。下面是如何使用。
.addEventListener添加事件失败原因之一
热门推荐
anwebDesigner的博客
02-08 1万+
正确语法：document.getElementById("myBtn").addEventListener("click", function(){ document.getElementById("demo").innerHTML = "Hello World"; });addEventListener() 方法用于向指定元素添加事件句柄。注意，这个指定元素是一个元素，所以当使用doc...
iframe添加addEventListener无效、获取Iframe的contentWindow和contentDocument失败，不使用postMessag，如何监听iframe点击事件
weixin_44434938的博客
12-26 4073
iframe添加addEventListener无效、获取Iframe的contentWindow和contentDocument失败，不使用postMessag，如何监听iframe点击事件
js滚动条事件监听addEventListener、removeEventListener不生效
weixin_36931308的博客
07-12 1240
参考：你所不知道的scroll事件：为什么scroll事件会失效？ | Ayase-252's wonderlandEventTarget.removeEventListener - Web API 接口参考 | MDN
@EventListener (ContextStartedEvent.class) 不起作用
hy_208的博客
04-27 2031
结果发现Spring 启动之后ContextStartedEvent不调用。改用ContextRefreshedEvent可以成功。
window.addEventListener来解决让一个js事件执行多个函数
10-27
`addEventListener`同样会按照函数注册的顺序执行，但与`attachEvent`不同的是，它是先注册的先执行。第三个参数`useCapture`在此处通常设为`false`，表示在冒泡阶段调用事件处理函数。 此外，对于DOM元素的事件...
动态的绑定事件addEventListener方法的使用
09-04
`addEventListener`是DOM（文档对象模型）级别2事件处理程序的一部分，它允许我们为一个元素添加一个或多个事件处理器。这个方法有两个参数：一个是事件类型（例如"click"、"mouseover"等），另一个是事件处理函数，...
表单的验证js以及事件的注册代码详解教程共25页.pdf
10-31
JavaScript可以通过`onsubmit`事件在表单提交时执行验证，或者使用`addEventListener`动态添加验证函数。 2. **JavaScript事件**：事件是用户与页面交互时触发的动作。在表单上下文中，常见的事件有： - **...
Spring中明明插入了数据，为什么事件监听器EventListener却读不到？
IT技术精选文摘
11-10 3120
若有收获,请记得分享和转发哦一、问题描述平时我们在完成某些数据的入库后，发布了一个事件，此时使用的是@EventListener，然后在这个事件中，又去对刚才入库的数据进行查询，从而完成...
关于iframe点击事件无效的解决办法
android_xiaobai1的博客
07-02 1万+
在一次项目的需求下，我偶然发现一个问题，为什么我给iframe添加点击事件无效。 经过度娘的一番解释发现，iframe是没有点击事件的，神奇! var iframe1 = document.querySelector('#iframeID') iframe1.addEventListener('click', function() { a...
vue中window.addEventListener(‘scroll‘, xx)失效解决办法
1
12-14 7272
多次尝试都无法获取到滚动事件,后来加上true之后就可以了 window.addEventListener('scroll', this.clintHeight, true)
@TransactionalEventListener 失效
weixin_42918955的博客
03-07 1476
status == STATUS_UNKNOWN-> newTransaction = false -> transactionActive=true -> ThreadLocal 获取当前线程的 ConnectionHolder.transactionActive=true-> 第一次进入切面会把 ConnectionHolder .transactionActive=true 设置到 ThreadLoacl 中。通过分析发现 status.isNewTransaction() = false。
SpringBoot事件机制@EventListener的简单使用
a272265225的博客
02-14 1772
SpringBoot 事件 Event EventListener AppicationEventPublish
在uniapp onload生命周期函数中执行，document.addEventListener 不生效
05-24
在 `uniapp` 中，`onLoad` 生命周期函数是在页面加载时执行的，但是此时页面可能还没有完全渲染完成，因此部分 `DOM` 元素可能还没有被创建，所以在 `onLoad` 中使用 `document.addEventListener` 可能不会生效。 建议在 `onReady` 生命周期函数中使用 `document.addEventListener`，因为此时页面已经渲染完成，`DOM` 元素已经被创建，可以正常添加事件监听。 例如： ``` export default { onReady() { document.addEventListener('click', () => { console.log('click event'); }); } } ```
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值