# 淺談jQuery this和$(this)的區別及獲取$(this)子元素物件的方法
在 jQuery 敘述中可以用 $(this) 來避免重複使用選擇器選取元素, 例如對於按鈕元素 button :
<button id="btn">OK</button>
用 jQuery 監聽 click 事件, 每按一次顯示已按次數 :
var cnt=0;
$("#btn").on("click", function(){
$("#btn").html("你按了" + (++cnt) + "次");
});
此例中的事件處理函式需要再一次存取按鈕之 jQuery 物件, 若用 $("#btn") 就重複使用選擇器兩次, 應該改為 :
var cnt=0;
$("#btn").on("click", function(){
$(this).html("你按了" + (++cnt) + "次");
});
完整程式碼參考 :
測試 1 : this 與 $(this) [看原始碼]
用 jQuery 監聽 click 事件, 每按一次顯示已按次數 :
var cnt=0;
$("#btn").on("click", function(){
$("#btn").html("你按了" + (++cnt) + "次");
});
此例中的事件處理函式需要再一次存取按鈕之 jQuery 物件, 若用 $("#btn") 就重複使用選擇器兩次, 應該改為 :
var cnt=0;
$("#btn").on("click", function(){
$(this).html("你按了" + (++cnt) + "次");
});
完整程式碼參考 :
測試 1 : this 與 $(this) [看原始碼]
一般常犯的錯誤例如在存取表單時, this.val() 是錯誤的, 因為 DOM 物件沒有 val() 方法, 要 jQuery 物件才有, 即應該是 $(this).val() 才對.
沒有留言 :
張貼留言