Open In App
Related Articles

jQuery change() Method

Improve Article
Improve
Save Article
Save
Like Article
Like

The jQuery change() is an inbuilt method that is used to detect the change in the value of input fields. This method works only on the “<input>, <textarea> and <select>” elements. 

Syntax :

$(selector).change(function)

Parameter: It accepts an optional parameter “function”. 

jQuery examples to show the working of change() method: 

Example 1: In the below code, no function is passed to the change method. 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
 
    <!--Demo of change method without passing function-->
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $("input").change();
            });
        });
    </script>
</head>
 
<body>
    <p>Click the button to see the changed value !!!</p>
    <!--click on this button and see the change -->
    <button>Click Me!</button>
    <p>Enter value:
        <input value="GeeksforGeeks"
               onchange="alert(this.value)"
               type="text">
    </p>
</body>
 
</html>

Output: 

Example 2: In the below code, function is passed to the change method. 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
 
    <!--Here function is passed to the change method-->
    <script>
        $(document).ready(function () {
            $(".field").change(function () {
                $(this).css("background-color", "#7FFF00");
            });
        });
    </script>
 
    <style>
        .field {
            padding: 5px;
        }
    </style>
</head>
 
<body>
    <!--write something and click outside -->
    Enter Value:
    <input class="field" type="text">
    <p>
        Write something in the input field, and then
        press enter or click outside the field.
    </p>
</body>
 
</html>

Output: 


Last Updated : 07 Jul, 2023
Like Article
Save Article
Similar Reads
Related Tutorials