1. 程式人生 > >jquery事件綁定

jquery事件綁定

解除綁定 html ack log -c pan this ext bind

 1     <body>
 2             <input type="button" id="J_btn_bind" value="bind方式綁定事件">
 3             <input type="button" id="J_btn_on" value="on方式綁定事件">
 4             <input type="button" id="J_btn_offAll" value="解除綁定事件">
 5             <ul class="cities">
 6                 <
li>傳智前端1</li> 7 <li>傳智前端2</li> 8 <li>傳智前端3</li> 9 <li>傳智前端4</li> 10 <li>傳智前端5</li> 11 </ul> 12 13 </body> 14 </html> 15 <script> 16 $(function
(){ 17 // bind方式綁定事件 18 $("#J_btn_bind").bind({ 19 click:function(){ 20 alert(bind啊綁定的事件) 21 }, 22 mouseenter:function(){ 23 $(this).css("background-color", "red"); 24 } 25 }) 26 // delegate方式綁定事件
27 $(".cities").delegate(li,click,function(event){ 28 alert($(this).text()); 29 }) 30 // on方式綁定事件 31 $("#J_btn_on").on(click,function () { 32 $(".cities").append(<li>dengyanbo</li>) 33 }) 34 // 解除事件綁定 35 $("#J_btn_offAll").on(click,function(){ 36 $("#J_btn_on").off(click); 37 38 $(".cities").undelegate(click); 39 40 $("#J_btn_bind").unbind(); 41 }) 42 }) 43 </script>

jquery事件綁定