• jQuery的事件绑定


    1.事件绑定

    DOM中事件绑定方式常用:

      元素.addEventListener("事件名", 事件处理函数对象)

      元素.removeEventListener("事件名", 原事件处理函数对象)

    jQuery:

      用.on(),代替了.addEventListener(): $元素.on("事件名",处理函数对象)

      用.off(),代替了.removeEventListener(): $元素.off("事件名", 原处理函数对象)

    具体jQuery事件可查看jQuery中文文档:

    以下列出常用的事件:

     change   下拉列表选中项改变
     click    单击
     dblclick   双击
      blur
     失去焦点
     focus   获得焦点 
     keydown   键盘按键按下
     keyup   键盘按键抬起
     mousedown   鼠标按键按下
     mouseenter   鼠标进入(jq)
     mouseleave   鼠标移出(jq)
     mousemove    鼠标移动
     mouseout   鼠标移出(dom)
     mouseover   鼠标进入(dom)
     mouseup   鼠标按键抬起
     resize    窗口大小改变
     scroll    网页滚动
     load    加载完成

    2.事件委托:

     jq中对DOM的事件委托进行了简化

    $父元素.on("事件名","选择器",function( ){
            //this代替e.target来获得目标元素
        var $this=$(this)
    })
    // on()中的选择器是相对于父元素的子选择器

      不用自己写if判断改为在.on()中添加第二个选择器参数,由.on()函数自动用我们提供的选择器作为判断条件筛选进入事件处理函数的元素对象。只有符合选择器要求的元素才能进入.on()内执行代码,如果不符合选择器要求的元素,不能进入.on执行操作。

       这样,就省略了DOM操作中的通过判断e.target.nodeName="标签名"来进行事件委托的步骤。

  • 相关阅读:
    极简Docker和Kubernetes发展史
    什么是健身
    《高效休息法》IT从业者如何高效休息
    《我们赖以生存的隐喻》文学中的面向对象
    sequelize时间自动格式化
    什么是消息队列
    node.js中this指向失效解决
    node.js的async和await
    node.js箭头函数使用
    node.js如何批量赋值
  • 原文地址:https://www.cnblogs.com/codexlx/p/12566766.html
Copyright © 2020-2023  润新知