zoukankan      html  css  js  c++  java
  • bind和on的区别

    bind方法与on方法都是事件绑定,但是两者却又有着一个大区别:事件委托

    jquery文档中bind和on函数绑定事件的用法:

    .bind(events [,eventData], handler)

    .on(events [,selector]  [,data], handler)

    从文档中可以看出,.on方法比.bind方法多一个参数'selector'子类选择器;

    事件委托就是子类的事情委托给父类的去做,而这就让我们想起了冒泡事件,是的,这的确是委托事件的原型,而我们的selector,则是判断是不是那个子元素触发的事件,如果不是,自然就忽略掉了;

    好处

    1.万一子元素非常多,给每个子元素都添加一个事件,会影响到性能;

    2.为动态添加的元素也能绑上指定事件;

    1比如一个有着1000条新闻的新闻列表,当我们绑定1000次的时候,会耗费很多资源,而一次事件委托就足够了;

    2.如:$('ul li').on('click', function(){console.log('click');})的绑定方式和$('ul li').bind('click', function(){console.log('click');})一样;我通过js给ul添加了一个li:$('ul').append('<li>js new li<li>');');这个新加的li是不会被绑上click事件的

    但是我用$('ul').on('click', 'li', function(){console.log('click');}方式绑定,然后动态添加li:$('ul').append('<li>js new li<li>');这个新生成的li被绑上了click事件

  • 相关阅读:
    jquery学习笔记
    javascript中的面向对象—— 学习1
    Sql Sever语句 (续2)
    Sql sever 常用语句(续)
    SqlSever 查询基本
    Microsoft SqlSever 数据库--软谋1
    如何编写高质量的Javascript代码
    要当好JavaScript程序员:5个debug技巧
    深入理解js构造函数
    命名空间$.fn
  • 原文地址:https://www.cnblogs.com/wangqiao170/p/10790159.html
Copyright © 2011-2022 走看看