欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

【jQuery】解决动态添加的元素绑定事件不生效的问题

程序员文章站 2022-05-10 17:22:33
...

最近做需求,碰到一个问题,动态新增的元素绑定的鼠标移入事件不生效。

尝试很多方法后解决,解决过程如下:

给动态元素绑定事件时使用的方法:

$("outerSelector").on("eventType","innerSelector",function(){}); 

比如:

 $(".showThi").on('mouseover','li',function(){

         var thiSelectText = $(this).text();

         $(this).css("background","#FF8202");

         $(this).siblings().css("background","#fff");      

 });

1、在使用on给动态添加的元素绑定事件时,outerSelector必须是原来就存在的元素。如下面的ul标签。

<div class="search-div mgt-30 mgb-30 tc word_addr">

       <ul class="showThi"></ul>

 </div>

 

2、innerSelector是追加的标签中的元素,我们例子中是li。

 

这样,动态增加的元素li就可以绑定鼠标移入事件mouseover了.

相关标签: jQuery 动态 DOM