JavaScript this.value 觸發時機：click 之外的事件綁定

原代碼僅在 click 事件中使用 this.value，實際上任何能觸發處理函數的事件 (如 mouseover、focus、change) 都能獲取 this.value。

常見事件與適用場景

代碼示範：mouseover 即時顯示值

<input type="text" id="txt" value="初始值" />
<div id="show"></div>

<script>
document.getElementById('txt').onmouseover = function() {
    document.getElementById('show').innerText = '當前值: ' + this.value;
};
</script>

jQuery 寫法

$('#txt').on('mouseover focus input', function() {
    $('#show').text('值: ' + this.value);  // this 指向原生 DOM 元素
});

// 或使用事件對象
$('#txt').on('input', function(e) {
    console.log(e.target.value);  // 更規範
});

關鍵點

• this 在內聯處理函數 (onxxx) 和 addEventListener 回調中指向觸發事件的 DOM 元素。
• 箭頭函數 不綁定 this，需用 e.target 或 e.currentTarget。
• value 屬性對 input、select、textarea、button 等表單元素均有效。

選擇合適事件，this.value 即可在 click 之外靈活使用。