1. 程式人生 > >Jquery事件機制

Jquery事件機制

{} 一次 不常用 常用 註冊 script 解綁 func 了解

JavaScript中已經學習過了事件,但是jquery對JavaScript事件進行了封裝,增加並擴展了事件機制,jquery不僅提供了更加優雅的事件處理方法,而且極大的增強了事件處理的能力

  jquery事件發展歷程(了解)

    簡單事件綁定----bind事件綁定----delegate事件綁定------on事件綁定(推薦)

  註冊簡單事件 缺點:一次只能註冊一個事件

  $("p").click(function(){})

  //bind註冊事件 註冊多個事件

  //delegate委托、代理事件

  $("div").delegate("selector","事件","函數");

    給div註冊委托事件,最終執行的元素為selector執行什麽事件--函數

      第一個參數:selector-----事件最終由誰執行

      第二個參數:-------事件類型

      第三個參數:------函數,事件做什麽

      好處:動態創建也有事件

      壞處:只能註冊委托事件

on註冊事件(重點)

  jquery1.7之後,jquery用on統一了所有事件的處理方法,最新代的方式,兼容zepto(移動端類似jquery的一個庫)強烈建議使用。

  1.on註冊簡單事件

  $(selector).on("click",function(){});

    //表示給元素指定事件,並由自己觸發,不支持動態綁定

  2.on註冊委托事件

  $(selector).on("click","span",function(){});

    //表示給元素綁定代理事件,當然必須是它的內部元素span才能觸發這個事件,支持動態綁定

  3.on註冊事件的語法:

    第一個參數:event,綁定事件的名稱可以由空格分開的多個事件

    第二個參數:selector,執行事件的後代元素(可選),如果沒有後代元素,那麽事件講有自己執行

    第三個參數:data,傳遞給處理函數的數據,事件觸發的時候通過event.data來使用(不常用)

    第四個參數:handler,事件處理函數

    $(selector),on(events,[selector],[data],handler);

事件解綁

  unbind方式(不用)

  $(selector).unbind(); 解綁所有的事件

  $(selector).unbind("click") 解綁指定的事件

  undelegate(不用)

  $(selector).undelegate();  解綁所有的delegate事件

  $(selector).undelegate(“click”);  解綁指定的delegate事件

  

Jquery事件機制