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

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

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

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

//新增的页面会用到的鼠标事件
$(document).delegate(".userM_info","mouseover",function(){
var forkIndex = $(this).index();
$('.userM_fork').eq(forkIndex).css("display","block");
});
$(document).delegate(".userM_info","mouseout",function(){
var forkIndex = $(this).index();
$('.userM_fork').eq(forkIndex).css("display","none");
});

对于拼接进去的html原来绑定的jq事件失效的更多相关文章

  1. jquery中,使用append增加元素时,该元素的绑定监听事件失效

    举例:如果在一个<div id="resultArea"></div>中,通过append添加一个id="checkOutTip"的文本 ...

  2. jquery中,使用append增加新元素时,新增元素的绑定监听事件失效的解决办法

    $("outerSelector").on("eventType","innerSelector",function(){}); 举例:如果 ...

  3. jquery中动态添加的标签绑定的click事件失效的解决办法

    把.click()换成.live('click',function(){})(如果你的jquery的版本是1.10之前) 把.click()换成.on('click',function(){})(jq ...

  4. 关于动态生成dom绑定事件失效的原因

    之前做项目都是直接用jquery的bind绑定事件,不过当时都不是动态生成dom元素,而是已经页面中原本存在的dom元素进行事件绑定,最近在测试给动态生成的dom绑定事件的时候发现事件失效,于是就测试 ...

  5. bind() unbind()绑定解绑事件

    .bind( eventType [, eventData], handler(eventObject)) 本文实例分析了JQuery中Bind()事件用法.分享给大家供大家参考.具体分析如下: .B ...

  6. 由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案。

    由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案. 动态在页面上添加了5个按钮,实现的功能应该是点击对应按钮在控制台输出相应的索引.但因为应该 ...

  7. 通过jQuery给<li>绑定点击事件

    背景:有个需求需要js中实现li标签的事件绑定,li通过在ajax请求中动态添加,按照常理,使用jQuery,可以使用以下方法绑定点击事件: $(function(){  commonAjaxCall ...

  8. jquery中bind()绑定多个事件

    bind()绑定事件 $(selector).bind(event,data,function): 参数event为事件名称(如"click,mouseover....."),da ...

  9. 一个DOM元素绑定多个事件时,先执行冒泡还是捕获

    绑定在被点击元素的事件是按照代码顺序发生,其他元素通过冒泡或者捕获“感知”的事件,按照W3C的标准,先发生捕获事件,后发生冒泡事件.所有事件的顺序是:其他元素捕获阶段事件 -> 本元素代码顺序事 ...

随机推荐

  1. Azure一个Cloud Service支持多个公网地址

    Azure刚刚发布在同一个Cloud Service下支持多个公网IP地址的功能. 这个功能主要是用于: 当相同的端口需要公用相同的LoadBalance时. 比如: 一种使用场景是多组Web服务器被 ...

  2. php + mssql乱码

    当用PHP自带的模块php_mssql.dll去调用MSSQL数据库时,中文数据会乱码.但如果我们采用ADODB的方式去做,就不会乱码了.请看下面的具体实例: 调用开源的adodb.inc.php(支 ...

  3. STM in Clojure

    Transactional memory in Clojure is implemented using Multiversion Concurrency Control protocol http: ...

  4. SAP ECC6 IDES安装及虚拟机下载

    SAP ECC6.0 SR3 IDES Oracle.torrent(48.12G)下载 SAP ECC6 安装系列 SAP ECC6.0 IDES在Win7 X64上的安装 SAP ECC6.0 R ...

  5. JNI初识

    JNI:Java Native Interface 的简写,是Java语言提供的一种通用接口,用于Java代码与本地化代码的交互. 所谓本地化代码是指直接编译成的与计算机相关的二进制代码,而非Java ...

  6. HDU - 3499 Flight 双向SPFA+枚举中间边

    Flight Recently, Shua Shua had a big quarrel with his GF. He is so upset that he decides to take a t ...

  7. JAVA企业级开发-xml基础语法&约束&解析(04)

    一.什么是xml html:超文本标记语言.它主要是用来封装页面上要显示的数据,最后通过浏览器来解析html文件,然后把数据展示在浏览器上.同样我们可以使用JS和DOM技术对html文件进行解析和操作 ...

  8. SQL Server 截取两个固定字符之间的字符串(案例)

    网上的问题: 参考这篇<函数PARSENAME使用和截取字符串>https://www.cnblogs.com/insus/p/10958452.html 的方法: )='||MO21|T ...

  9. (转)深度学习(Deep Learning, DL)的相关资料总结

    from:http://blog.sciencenet.cn/blog-830496-679604.html 深度学习(Deep Learning,DL)的相关资料总结 有人认为DL是人工智能的一场革 ...

  10. 以太坊开发教程(一) truffle框架简介/安装/使用

    通常一个DAPP的开发包括两部分:智能合约的开发和提供合约进行调用的前端页面. truffle提供了对这两部分内容比较简单的开发方式,特别是在开发/测试阶段.给开发人员提供快捷的打包/部署,已经本地服 ...