on註冊事件及事件解綁

一、on註冊事件

## css部分

<div class="box">
        <div class="item">1111</div>
        <div class="item">2222</div>
        <button class="btn">按鈕</button>
         <button id="of">解綁</button>
    </div>
    $(".btn").click(function () {
        $("<div class='item'>3333</div>").appendTo($(".box"));
    });




1.簡單事件綁定
 $(".item").click(function () {
        console.log(this.innerText)
    })

2.bind事件綁定
 $(".item").bind("click" , function () {
        console.log(this.innerHTML)
    })
3.delegate事件綁定
 $(".box").delegate("div" , "click" , function () {
        console.log($(this).text())
    })
4.on事件綁定
  $(".box").on("click" ,"div" ,{name:"haha"}, function (e) {
       console.log($(e.data));
   });

二、事件解綁

1.on事件的解綁
    $("#of").click(function () {
       $(".box").off("click");
   }); 
2.delegate事件的解綁
    $("#of").click(function () {
        $(".box").undelegate("click");
    });
3.bind事件的解綁
    $("#of").click(function () {
        $(".item").unbind("click");
    });