jquery 中 事件綁定函數 bind() ,live(),delegate()以及on() 的區別

jquery中事件綁定的方法有好幾種,下面是我對這些方法的理解

1.bind(),我們最常使用的方法之一,它會給每個匹配的元素綁定 事件以及添加時間處理函數

<div>
   <ul>
          <li></li>
          <li></li>
          <li></li>
   </ul>
</div>

$(” div>ul li”).bind(“click”,function(){
alert(” this is a test”);
})
bind 給ul 中的每一li元素綁定點擊事件和時間處理程序

2.live() 利用時間委託機制,它會將事件綁定到匹配元素的根元素(document)上
live()會強制默認根元素爲document
3.delegate() 與live() 類似 它會將事件綁定到指定的根元素上 並不會強制限定根元素

div id="root">
  <a>Alice</a>
  <a>Bob</a>
</div>
<script>
$('#root').delegate('a', 'click', function(){
    console.log('clicked');
});
</script>

4 on() on方法是以上三種方式的總和`

//bind
( “#foo” ).bind( “click”, function( e ) {} ); ( “#foo” ).on( “click”, function( e ) {} );

// delegate
( “#root” ).delegate( “a”, “click”, function( e ) {} ); ( “#root” ).on( “click”, “a”, function( e ) {} );
“`

`

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章