js 绑定事件失败问题

最新推荐文章于 2022-11-13 16:24:48 发布

咕噜咕噜的车轮向前

最新推荐文章于 2022-11-13 16:24:48 发布

阅读量809

点赞数 1

分类专栏：开发过程总结文章标签：动态 append 事件生成失效

本文链接：https://blog.csdn.net/zhongmei121/article/details/90751667

版权

开发过程总结专栏收录该内容

66 篇文章 1 订阅

订阅专栏

1、动态生成的dom节点，绑定事件生效问题：

解决办法就是定位到父元素，然后绑定父元素的子元素事件

例如.nav-tabs的子元素li是动态生成的（通过append()函数或者vue数据双向绑定生成的等），

通过 $('.nav-tabs li').on('click',function(e){ }) 直接绑定li事件不生效，

正确写法是 $('.nav-tabs').on('click','li',function(e){ })

2、有可能是父节点已经绑定了同样的事件，子节点再绑定此事件不生效

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

咕噜咕噜的车轮向前

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

JavaScript-事件处理（事件绑定、监听器、返回值、事件对象）

weixin_44233876的博客

05-17

3666

一、传统的事件绑定两种方法一定要掌握第一种，在html代码中嵌入行内的事件句柄 <body> <p onclick="f()">我是文字</p> </body> function f(){ alert("你好"); } 第二种，函数对象赋值给时间句柄 //为了在页面渲染完成后再加载下列代码，将其放在函数init中 ,并给init函数设置为onload <body onload="init()"&gt

关于js中绑定事件失效问题

a810373329的博客

05-02

9641

相信很多开始学习前端开发的朋友都发生过绑定事件失效的问题，那么究竟是什么原因使得事件失效呢？这里作者以jquery库编写作为例子。第一种：直接失效。 <html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type=

参与评论您还未登录，请先登录后发表或查看评论

js错误绑定事件方法

qq_40285497的博客

06-24

299

以下这种绑定事件方法是极其不好的不是相互独立的，会产生各种问题，任何事件都不要嵌套事件。$(document).on('click','.inputDropDownBox',function () { $('.inputDropDownBox .menu').toggle(); $(document).on('click','.inputDropDownBox .menu span...

a标签绑定点击事件失败

weixin_34239592的博客

03-04

431

如图然后对a标签绑定点击事件无效换成span标签可以转载于:https://www.cnblogs.com/csong7876/p/8504785.html

关于js中无法绑定点击事件

weixin_57742552的博客

06-28

741

在js文件中添加点击事件失败，但是HTML中onclick就能成功。解决办法：将js的引用的script标签放到</body＞的后面。这样在页面渲染之后再执行js代码。

JS解决因循环绑定click事件失效

weixin_44739881的博客

07-20

2180

很多js新手都会在绑定事件遇到绑定失效的问题。大致思路就是，比如用一个循环让对应的button按钮绑定对应的事件。比如这样 <button id="1">1 </button> <button id="2">2 </button> <button id="3">3 </button> </body>...

js移除事件 js绑定事件实例应用

10-27

JavaScript是Web开发中不可或缺的一部分，尤其在处理用户交互时，事件绑定和移除事件起着至关重要的作用。本文将深入探讨这两个概念，并提供一个兼容各浏览器的实例应用。首先，让我们了解一下JavaScript中的事件...

jquery绑定事件不生效的解决方法

10-26

由于JavaScript代码是在页面加载完成后执行的，如果在页面元素加载之前就执行绑定事件的代码，那么自然无法找到对应的元素，导致事件绑定失败。 2. 代码中存在错误导致事件绑定代码没有被执行。可能是由于某些语法...

使用layui监听器监听select下拉框,事件绑定不成功的解决方法

10-16

如果问题仍然存在，建议检查浏览器的开发者工具（如Chrome的DevTools），查看是否有相关的JavaScript错误或网络请求失败，这将有助于定位并解决问题。总的来说，理解layui的事件绑定机制和正确使用`form.on()`方法...

jquey && javascript 绑定点击事件(click事件无反应，因js获取不到当前的点击项)

凌风的博客

07-02

2625

//点击播放单词音频 $(document).off("click").on("click", ".audiolins", function (event) { event.stopPropagation(); var au...

jquery绑定click事件失败解决办法

zkg510168343的专栏

12-16

2174

$(".classname").on('click', function(){ do some thing... }); 当绑定的事件为js生成的html时，click事件失效，解决办法在外层定义一个class，就是js生成html的外围，click后面跟着要绑定的classname $(".list").on('click', 'classname', function(){ do

绑定不了事件

lidog的博客

05-21

366

碰到绑定不到事件的情况的时候，考虑下面的方式；具体绑定不上原因不明 $(document).on('click','#span_'+id,function(){ $('#miaoshu_content_'+id).show(); $('#min_miaoshu_conte

关于js&Jquery中单击事件的绑定时常见错误及解决方案

W_Cai_niao的博客

06-22

468

**在写js代码时，常会出现绑定了单击事件，但会报出not defined的错误，在此结合自己code过程中碰到的一些常见问题进行总结。** 1.将单击事件绑定在html标签体内部的情况单击事件运行成功。直接将函数放置在script标签中。 <body> <input type="checkbox" onclick="selectAll(this)" > </body> <script> function selectAll(obj){ ...

js事件绑定不成功的处理办法

Areigninhell的博客

04-01

816

1：查看代码格式是否正常2：理一理页面的执行顺序3：查找所选元素是否正常，使用浏览器的“鼠标箭头”

绑定多个事件，如何决定前面事件失败后面事件不执行

zb219的专栏

01-23

679

其实就用冒泡把最后一个事件，写在父层，如果子层事件return false,则冒泡停止，父层事件不执行 $("#ccc").bind("click", function () { alert(1); }); $("#ccc

移动端动态节点绑定事件ios点击失效

Eighteen Z

06-27

4378

当你的DOM节点是动态生成在页面上的时候。普通的点击$(‘xx’).click()会因为获取不到dom元素而致使点击失效。一这种情况下一般使用时间托管例如jq的:$(document).on('xx','click',fn)这个通过事件托管可以让jq获取到动态生成的dom节点，以此解决点击失效的问题。二然而在ios上这样的方法解决不了这个问题,原因是: 在ios系统中,例如

js循环绑定事件问题及解决方法

JiangNanMax的博客

08-31

8697

js初学者经常遇到的循环绑定事件问题 js循环绑定事件在编写JS代码的时候，我们经常会遇到要对一系列元素进行事件绑定的情况，然后就会理所当然的开一个for循环，对元素的事件进行赋值等操作，最后运行的效果却不是希望有的样子，事件的响应只能和最后一个元素一样，怎么肥四？？？下面给出错误的代码： &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &

js添加事件失效原因