文本框事件(html5文本框事件怎么應用)

在 HTML5 中,文本框(<input type="text">)可以通過 JavaScript 來處理各種事件。以下是一些常見的文本框事件

及其應用方法:

1. onfocus: 當文本框獲取焦點時觸發。

html

<input type="text" onfocus="myFunction()">

JavaScript 代碼:

javascript

function myFunction() {

alert("文本框獲得焦點了");

}

2. onblur: 當文本框失去焦點時觸發。

html

<input type="text" onblur="myFunction()">

JavaScript 代碼:

javascript

function myFunction() {

alert("文本框失去焦點了");

}

3. onkeyup: 當用戶松開鍵盤上的按鍵時觸發。

html

<input type="text" onkeyup="myFunction(event)">

JavaScript 代碼:

javascript

function myFunction(event) {

console.log(event.key);

}

這個示例中,event.key 可以獲取用戶松開的按鍵的值。

4. onkeydown: 當用戶按下鍵盤上的按鍵時觸發。

html

<input type="text" onkeydown="myFunction(event)">

JavaScript 代碼:

javascript

function myFunction(event) {

console.log(event.key);

}

這個示例中,event.key 可以獲取用戶按下的按鍵的值。

5. oninput: 當文本框的值發生改變時觸發。

html

<input type="text" oninput="myFunction()">

JavaScript 代碼:

javascript

function myFunction() {

alert("文本框的值發生了改變");

}

這只是一些常見的文本框事件,HTML5 還提供了其他許多事件,可以根據需要選擇適合的事件來處理文本框的交互。