jQuery Keyup() Event Method Example

jQuery Keyup() Event Method Example

Jquery keyup() event method; In this tutorial, you will learn how to use the jQuery keyup event method with HTML elements.

jQuery Keyup() Event Method

The keyup() event occurs when a keyboard button/key is released. This keyup () method triggers the keyup event, or attaches a function to run when a keyup event occurs.

Syntax of jQuery Keyup() Event Method

$(selector).keyup() 

This triggers the keydown event for the selected elements.

$(selector).keyup(function)  

Parameters of jQuery Keyup() Event Method

ParameterDescription
FunctionIt is an optional parameter. It is executed itself when the keypress event is triggered.

Examples of jQuery Keyup() Event Method

Let’s see an example1 of jQuery keyup() .

<!DOCTYPE html>  
<html>  
<head>  
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>  
$(document).ready(function(){  
    $("input").keydown(function(){  
        $("input").css("background-color", "green");  
    });  
    $("input").keyup(function(){  
        $("input").css("background-color", "pink");  
    });  
});  
</script>  
</head>  
<body>  
Fill the Input Box: <input type="text">  
</body>  
</html>   
Fill the Input Box:

Let’s see an example 2 of jQuery keyup() .
<html> 
<head> 
<title>Jquery Keyup() Event </title> 
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head> 
<body> 
 <b> 
  <h1>Press and release a key from the keyboard </h1> 
 </b> 
</body> 
<script> 
 $(document).keyup(function(event) { 
  alert('You have released a key'); 
 }); 
</script> 
</html> 

In the above example, you will press a key on the keyboard and release it. When you have released a key this jquery keyup event trigger and show alert on your dasktop screen.

Recommended jQuery Tutorials

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Python, Javascript, JQuery, Laravel, Livewire, Codeigniter, Node JS, Express JS, Vue JS, Angular JS, React Js, MySQL, MongoDB, REST APIs, Windows, Xampp, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL and Bootstrap from a starting stage. As well as demo example.

Leave a Reply

Your email address will not be published. Required fields are marked *