Introduction:

Here we are going to explain what is keyup() event or how to use keyup() event or why to use keyup() event with example.

Description: 

The jQuery keyup() event occurs when a keyboard button is released after pressing.Whenever a key is triggered, the keyup() method binds function to an event on an element. This method is executed or attach a function to run when a keyup() event occurs.

  • Syntax:

Trigger the keyup event for the selected elements:

 

$(selector).keyup()



  • Example of jQuery keyup() event


Let's see an example to of jQuery keyup() event.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jquery keypress tutorial</title>
    <script src="Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("input").keyup(function () {
                $("#content").text($(this).val());
                $("#content").css("color", "red");
            });
 
        });
    </script>
 
</head>
<body>
    Write something: <input type="text">
    <p id="content" style="margin-top:10px; width: 300px; height: 88px; color:#fff;">
 
    </p>
</body>
</html>


As shown in the above program, we have used the code inside $(document).ready which is an event which fires up when document is ready. It will run once the page document object model is ready for JavaScript code to execute.

$(“input”).keyup(function()) line specifies the event which will occur when key is released in the keyboard .

When user enter something in the text box, the text box value will display in “p” element.

When you run the above example, you would get the following output:

 Use jQuery keyup event


I hope it will help to you.

0 comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

you may also like