JavaScript: onKeyPress, onKeyDown, onKeyUp

Đăng ký nhận thông tin về những video mới nhất

Tổng quan

Các hành động của người dụng đối với bàn phím có thể được nhận diện trong JavaScript. Điều này rất hữu dụng, ví dụ như một chương trình game trong đó bàn phím là một đầu vào và phải xác định hành động tiếp theo. Các sự kiện onKeyPress, onKeyDown và onKeyUp được kích hoạt khi người dùng nhấn một phím bất kỳ trên bàn phím rồi nhả ra. Sự kiện onKeyPress là sự kiện kết hợp của hai hành động: sau khi nhấn phím trên bàn phím xuống thì sự kiện được kích hoạt ngay tại lúc bạn nhả phím ra. Sự kiện onKeyDown được kích hoạt khi bạn nhấn một phím nào đó xuống và sau đó nhả phím ra (onKeyUp). onKeyDown và onKeyPress sẽ liện tục được kích hoạt nếu người dùng nhấn phím xuống mà không nhả ra. Còn sự kiện onKeyUp sẽ được kích hoạt khi bạn nhả phím ra. Một số trình duyệt có thể có những cách xử lý sự kiện bàn phím khác nhau.

Ví dụ:

Ví dụ về sự kiện onKeyPress:

   

   

    Key Events

   

1  

    Nhấn một phím bất ký trên bàn phím xuống và quan sát hiện tượng xảy ra!

 

GIẢI THÍCH

1. Thẻ được gán một sự kiện là onKeyPress. Nếu người dùng nhấn một phím bất kỳ trên bàn phím xuống tại trang web hiện thời thì phương thức alert() sẽ được kích hoạt và bạn sẽ thấy một thông báo xuất hiện và hiển thị phím bạn đã nhấn.

2. Trước tiên là ta check xem trình duyệt có phải là Netscape hay không. Netscape và IE sử dụng những thuộc tính khác nhau để diễn đạt giá trị của phím được nhấn .
3. Thuộc tính của đối tượng người dùng sự kiện diễn đạt giá trị ASCII của phím được nhấn .
4. Phương thức chuyển giá trị ASCII của phím được nhấn sang dạng ký tự, ví dụ điển hình giá trị ASCII là 65 thì ký tự tương ứng là ‘ A ‘ .
5. Nếu trình duyệt không phải là Netscape ( IE ví dụ điển hình ) thì sẽ có phương pháp riêng. Các trình duyệt khác sử dụng thuộc tính sự kiện. keyCode để biểu lộ giá trị của phím được nhấn .

Ví dụ về sự kiện onKeyDown và onKeyUp:

   

   
    onKeyDown & onKeyUp
   
   

   

   

onKeyUp và onKeyDown

   

   
Một mũi tên đi xuống màu green sẽ xuất hiện khi bạn focus vào text field và nhấn một phím xuống để điền dữ liệu
và một mũi tên đi lên sẽ xuất hiện khi bạn nhả phím đó ra.

1  

Xin mời nhập liệu :

2       3 onKeyDown = ” document. Arrow. src = ‘ http://v1study.com/public/images/article/green_globe_down_arrow_557.jpg ‘ ”
4 onKeyUp = ” document. Arrow. src = ‘ http://v1study.com/public/images/article/green_globe_up_arrow_560.jpg ‘ ” >

       

5  

 

GIẢI THÍCH

1. Điểm mở màn của form .

2. Kiểu của input là textbox và chứa được tối đa 10 ký tự.

3. Sự kiện onKeyDown được kích hoạt khi người dùng nhấn một phím nào đó xuống textbox để điền tài liệu, khi đó nguồn của ảnh có tên ” Arrow ” sẽ được gán một ảnh ” down arrow ”
4. Sự kiện onKeyUp được kích hoạt khi người dùng nhả phím ra, khi đó nguồn của ảnh ” Arrow ” sẽ được gán một ảnh ” up arrow ” .
5. Ảnh mặc định, có tên là Arrow, nó sẽ Open khi người dùng điền tài liệu vào textbox .

ĐÁNH GIÁ post
Bài viết liên quan

Tư vấn miễn phí (24/7) 094 179 2255