Mouseover在拼接的html无效处理

正常情况下：

//鼠标移入移出（顶部企业图标信息）
            $(".patternBg").mouseover(function (){  
                $(".enterpriseContent").show();   
            }).mouseout(function () {
                $(".enterpriseContent").hide();
            });

修改成：

//鼠标移入移出（顶部企业图标信息）
            $(document).delegate(".patternBg","mouseover",function(){
                var forkIndex = $(this).index();
                $('.enterpriseContent').eq(forkIndex).css("display","block");
            });
            $(document).delegate(".patternBg","mouseout",function(){
                var forkIndex = $(this).index();
                $('.enterpriseContent').eq(forkIndex).css("display","none");
            });

 

备注原因：

JQ拼接显示的页面中鼠标事件失效

由于是先加载html在用js层绑定的所有后来加进来的html内容就不再绑定js了

所以我们需要利用delegate绑定，但是同样道理也不能写在普通的方法层里，因为这样还是会失效

所以本身拼接的时候我们就在componentDidMount()里我们就继续在尾部添加我们的delegate()

 

摘抄自：https://www.cnblogs.com/RikuBlog/p/9530874.html

谢谢