zoukankan      html  css  js  c++  java
  • jquery 用addClass之后 class有对应的事件,为什么要重新绑定一下事件呢

    假设有元素A,B,C,其中A和B都有class属性cls,如果在页面加载完成时,给具有class属性为cls的元素绑定某一事件,例如click,执行事件时调用alert。也就是说,页面加载完成后A和B都会被绑定事件,但C没有绑定。绑定事件相当于给A和B添加了一个click属性,显然此时C是没有该属性的。然后你给C添加了cls的class,但此时你做的事情仅仅是添加class,而没有绑定事件,所以,尽管C有cls属性,但它没有绑定事件,绑定事件和添加class是两件事,如果只做了一个,不会影响另一个的。


    再比如说,你给A和B绑定事件后,再去掉A的cls的class,此时A没有cls,但事件应经绑定了,A的click事件依然有效。它不会因为cls的移除而取消已经绑定的事件。


    如果你想要后续增加class的元素能够自动绑定事件,可以使用jquery的live方法



    $('.class').live("click",function(){
    //TODO

    });



    jQuery中.bind() .live() .delegate() .on()的区别点击打开链接 jQuery的.bind()、.live()和.delegate()之间区别

    bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数

    $("a").bind("click",function(){alert("ok");});

    live(type,[data],fn) 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的

    $("a").live("click",function(){alert("ok");});

    delegate(selector,[type],[data],fn) 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数

    $("#container").delegate("a","click",function(){alert("ok");})

    on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数

    差别:

    .bind()是直接绑定在元素上

    .live()则是通过冒泡的方式来绑定到元素上的。更适合列表类型的,绑定到document DOM节点上。和.bind()的优势是支持动态数据。

    .delegate()则是更精确的小范围使用事件代理,性能优于.live()

    .on()则是最新的1.7版本整合了之前的三种方式的新事件绑定机制


  • 相关阅读:
    Windows环境安装tesseract-ocr 4.00并配置环境变量
    python问题集
    使用CefSharp在.Net程序中嵌入Chrome浏览器(八)——Cookie
    python虛擬環境和工具
    pycharm使用(持续更新)
    醒过来的都市
    下一个十年计划6-作品
    下一个十年计划5-方向选择
    下一个十年计划4-反向选择
    负逻辑的实际应用
  • 原文地址:https://www.cnblogs.com/dfyg-xiaoxiao/p/7213742.html
Copyright © 2011-2022 走看看