onkeyup Event

DOM Events KeyboardEvent

Definition and usage

The onkeyup event occurs when the user releases a key (on the keyboard).

Tip:Event order related to the onkeyup event:

  1. onkeydown
  2. onkeypress
  3. onkeyup

Example

Example 1

Execute JavaScript when the user releases a key:

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

Try it yourself

Example 2

Use "onkeydown" and "onkeyup" events together:

<input type="text" onkeydown="keydownFunction()" onkeyup="keyupFunction()">

Try it yourself

Example 3

Output the actual key released in the text field:

Enter your name: <input type="text" id="fname" onkeyup="myFunction()">
<script>
function myFunction() {
  var x = document.getElementById("fname").value;
  document.getElementById("demo").innerHTML = x;
}
</script>

Try it yourself

Syntax

In HTML:

<element onkeyup="myScript">

Try it yourself

In JavaScript:

object.onkeyup = function(){myScript};

Try it yourself

In JavaScript, use the addEventListener() method:

object.addEventListener("keyup", myScript);

Try it yourself

Note:Internet Explorer 8 or earlier versions do not support addEventListener() method.

Technical details

Bubbling: Support
Cancellable: Support
Event types: KeyboardEvent
Supported HTML tags: All HTML elements except: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> and <title>
DOM Version: Level 2 Events

Browser Support

Events Chrome IE Firefox Safari Opera
onkeyup Support Support Support Support Support
DOM Events KeyboardEvent