zoukankan      html  css  js  c++  java
  • 使用jquery动态生成的标签,需要在代码当中绑定才可以实现事件的监听

      插入html代码后要重新绑定事件

    近日工作当中,需要对由jquery动态生成的标签添加一些事件效果。

    最初的做法是在页面载入时调用事件监听如下:

    Js代码 复制代码 收藏代码
    1. $(document).ready(function(){   
    2.            $("a.keyWord1").hover(   
    3.                     function(){   
    4.                       $(this).css("text-decoration","underline");   
    5.                       $(this).css("color","#fc9b3f");   
    6.                     },   
    7.                     function(){   
    8.                         $(this).css("text-decoration","none");   
    9.                         $(this).css("color","");   
    10.                     }   
    11.             );   
    12.         });  

     本意是,当鼠标移动到a标签时触发hover效果。但是最终一点发应也没有,当然以上的代码没有问题,我在其它地方是可以使用的。

    后来对比了其它地方用到这段代码的标签,发现我当前的a标签是通过jquery动态生成的,而不是后台生成的,所以思考可能是由于jquery在页面加载绑定事件时,由于我的后来动态生成的a标签还不存在,所以事件绑定自然就不成立!当然一点反应也没有!

    找到问题,就开始找解决方案:

    方案如下(不是很完美)

    在动态生成标签后,添加如下代码:

    Js代码 复制代码 收藏代码
    1. $("a.keyWord1").bind("mouseover",function(){   
    2.           $(this).css("text-decoration","underline");   
    3.           $(this).css("color","#fc9b3f");   
    4.   
    5.        });   
    6.         $("a.keyWord1").bind("mouseout",function(event){   
    7.         //阻止事件冒泡   
    8.            event.stopPropagation();             
    9.           $(this).css("text-decoration","none");   
    10.           $(this).css("color","#06F");   
    11.             $(this).unbind();   
    12.        });  

    上面的代码意思是,对a标签,且class=keyWord1的标签进行事件的绑定!

    这样就达到我的目的!

  • 相关阅读:
    《C++ Primer》读书笔记之第15章:面向对象编程
    Color Space: HSI
    Color Space: Lab
    C# 特殊关键字
    WPF 打开文件、文件夹
    EmguCV+Win7+Visual C# 2012 配置
    C# 常用结构
    C#抽象类、抽象方法、虚方法
    C# Image 、 byte[] 、Bitmap之间的转化
    java反射机制基础
  • 原文地址:https://www.cnblogs.com/scgw/p/1971888.html
Copyright © 2011-2022 走看看