jquery事件綁定
阿新 • • 發佈:2018-01-02
解除綁定 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事件綁定