Skip to content
Related Articles
Open in App
Not now

Related Articles

jQuery change() Method

Improve Article
Save Article
Like Article
  • Last Updated : 17 Nov, 2022
Improve Article
Save Article
Like Article

The jQuery change() is an inbuilt method that is used to detect the change in 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: 

 


My Personal Notes arrow_drop_up
Like Article
Save Article
Related Articles

Start Your Coding Journey Now!