< ! DOCTYPE html >
< html >
< body >
< p > H àm s ẽ được k ích ho ạt khi ng ười d ùng th ả m ột ph ím đã nh ấn trong th ẻ. H àm n ày s ẽ chuy ển to àn b ộ n ội dung sang ch ữ vi ết hoa . < /p >
Nh ập t ên c ủa b ạn : < input type ="text" id ="fname" onkeyup ="myFunction()" >
<script>
function myFunction ( ) {
var x = document . getElementById ( "fname" ) ;
x . value = x . value . toUpperCase ( ) ;
}
</script>
< /body >
< /html >
Demo
Xem thêm ví dụ bên dưới
Định nghĩa và cách sử dụng
Thuộc tính onkeyup được kích hoạt khi người dùng thả một phím (trên bàn phím).
Mẹo: Thứ tự sự kiện liên quan tới onkeyup:
onkeydown onkeypress onkeyup
Trình duyệt hỗ trợ
Thuộc tính
onkeyup
Có
Có
Có
Có
Có
Khác biệt giữa HTML 4.01 và HTML5
Không có sự khác biệt.
Cú pháp
<element onkeyup ="script" >
Giá trị thuộc tính
Giá trị Miêu tả
script Chạy script khi thuộc tính được kích hoạt
Chi tiết
Sự kiện được sử dụng trong tất cả các thẻ HTML ngoại trừ : <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> và <title>
Ví dụ
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
< ! DOCTYPE html >
< html >
< body >
< p > Khi b ạn nh ấn v à gi ữ m ột ph ím trong th ẻ b ên d ưới , m àu n ền s ẽ chuy ển sang m àu đỏ. Th ả ph ím ra , m àu n ền s ẽ chuy ển sang m àu xanh l á c ây . < /p >
< input type ="text" id ="demo" onkeydown ="keydownFunction()" onkeyup ="keyupFunction()" >
<script>
function keydownFunction ( ) {
document . getElementById ( "demo" ) . style . backgroundColor = "red" ;
}
function keyupFunction ( ) {
document . getElementById ( "demo" ) . style . backgroundColor = "green" ;
}
</script>
< /body >
< /html >
Demo
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
< ! DOCTYPE html >
< html >
< body >
< p > H àm s ẽ được k ích ho ạt khi ng ười d ùng th ả ph ím tr ên th ẻ input ở d ưới . H àm s ẽ hi ển th ị n ội dung trong th ẻ input sau khi ph ím được th ả. < /p >
Nh ập t ên c ủa b ạn : < input type ="text" id ="fname" onkeyup ="myFunction()" >
< p > T ên t ôi l à: < span id ="demo" > < /span > < /p >
<script>
function myFunction ( ) {
var x = document . getElementById ( "fname" ) . value ;
document . getElementById ( "demo" ) . innerHTML = x ;
}
</script>
< /body >
< /html >
Demo
WebVN Cộng đồng web Việt Nam
