jQuery事件機制

事件的註冊

• 普通的註冊簡單的事件，缺點只能註冊一個事件

  $("p").click(function(){
      alert("簡單的事件");
  }) 

• bind方式註冊事件

  $("p").bind({
      click:function(){
          alert('這是bind的click事件');
      },
      mouseenter:function(){
          alert('這是bind的mouseenter事件');
      }
  })

• 委托事件 delegate

  $("div").delegate("p","click",function(){
      alert("這是一個委托事件");
  })

要給div註冊一個委托事件，但是最終不是div執行的，而是p執行。

第一個參數指明事件由誰來執行。

第二個參數是事件的類型

第三個從參數，函數

• 發展到on事件,既可以委托，又可以做普通事件

  $("div").on("click","p",function(){
      alert("on的委托事件");
  })
  $("#btm").on("click",function(){
      alert("你點擊的是on的普通事件");
  })

一般建議用on來註冊事件，如果是用jq動態添加元素，而元素又有事件，那麼要使用委托事件才能使元素帶有事件。

事件的解綁

• unbind方式（一般不用）

  $(selector).unbind();//解綁所有事件
  $(selector).unbind("click");//解綁指定事件

• undelegate(一般不用了)

  $(selector).undetegate();
  $(selector).undetegate();

• off推薦使用的方式

  $(selector).off();//解綁所有事件
  $(selector).off("click");//解綁指定事件

觸發事件

$("#btn").on("click",function(){
    $("p").click();
    $("p").trigger("click");
})

阻止冒泡事件

$("a").on("click",function(e){
    alert("onclick");
    //return false;     //阻止瀏覽器預設行為和事件冒泡
    e.preventDefault(); //阻止瀏覽器預設行為
    e.stopPropagation();//阻止冒泡
})