溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
.bind()方法可使用.on()方法來代替
on()方法提高代碼易讀性，如下
$("input").bind("click", { foo: "hello" }, handler);
$("input").on("click", { foo: "hello" }, handler);
bind()綁定事件的時候，這些元素必須已經存在，而on()可以處理類似于代理這樣的東東，也就是說不存在的元素（動態生成的元素也可以處理），如下動態生成的 To do list ，再雙擊刪除，可使用on()輕松完成，你會發現，on換成bind是不行的。
<input type="text" id="str"> <button id="btn">添加</button> <h4>To do list</h4> <ul></ul>
$(document).ready(function(){
$('#btn').on('click',function(){
var str = $('#str').val();
$('<li>').text(str).appendTo('ul');
$('#str').val('');
})
//To do list雙擊刪除
$(document).on('dblclick','li',function(){
$(this).remove();
})
});
on()事件綁定的妙用：我們經常要在網頁里面處理大量的表格，假設表格有1000行，如果為每個tr都綁定一個click事件是非常占用內存的，而更加優雅的方法是：使用父元素tbody作事件代理，只需綁定一次，子孫元素tr上發生的事件會冒泡到tbody進行處理，節省開銷
//效率低下的寫法
$( "#dataTable tbody tr" ).on( "click", function() { \……
//換成優雅高效滴
$( "#dataTable tbody" ).on( "click", "tr", function() { \……
總結
以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對億速云的支持。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
