jQuery報錯at w.fn.init.val (jquery.min.js:2)

jquery.min.js:2 Uncaught TypeError: Cannot read property 'toLowerCase' of undefined
    at w.fn.init.val (jquery.min.js:2)
    at HTMLInputElement.<anonymous> ((index):71)
    at HTMLInputElement.dispatch (jquery.min.js:2)
    at HTMLInputElement.y.handle (jquery.min.js:2)

JS代碼如下:

const task = $("#task");
task.on('keyup', (event) => {
	 if(event.keyCode === 13){
		//  回車鍵
		let taskName = $(this).val();
		if( taskName.trim().length === 0) {
			alert('請輸入任務名稱!')
			return;
		}
		// TODO
	 }
})

打印了this發現指向的居然是Window,Window當然沒有val()方法了,故此報錯。之後纔想起來箭頭函數不改變this指向,function定義的函數可以改變this指向,function內部的this會指向觸發它的對象。

解決辦法:
將上面代碼第二行中的
task.on('keyup', (event) => {
改爲function定義的形式:
task.on('keyup', function (event) {

此時this指向的就是觸發它的對象了。

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