onchange function in jQuery change event occurs when the value of an element is changed. Get selected value of dropdown in jquery by id, name, class with onchange event;

onchange function in jquery

Contents

Reset input fields using onchange event in JQuery or Reset specific input fields using onchange event in JQuery Example with demo.

$(".sel").change(function(){
    var selValue = $(this).val();
    alert(selValue);

});

Example: jQuery get value of select onChange

index.html

<!DOCTYPE html>
<html>
<head>
   <title>Jquery Get Selected Dropdown Value on Change Event Example - www.pakainfo.com</title>
   <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
</head>
<body>
   
<h3>Jquery Get Selected Dropdown Value on Change Event Example</h3>
   
<select name="blogger" class="blogger">
    <option>--Select blogger--</option>
    <option value="pk">Pakainfo.com</option>
    <option value="ik">infinityknow.com</option>
    <option value="w3">w3diy.com</option>
</select>
   
<script type="text/javascript">
    $(".blogger").change(function(){
        var selValue = $(this).val();
        alert(selValue);
    });
</script>
   
</body>
</html>

Don’t Miss : JQuery Get Value Of Select OnChange Example

Reset input fields using onchange event in JQuery

index.html

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
    <input type="text" class="maindemo3"><br><br>
    <input type="text" class="maindemo3"><br><br>
    <input type="text" class="maindemo3"><br><br>
    <select id="product_type">
<option value="mobile">Mobile</option>
<option value="laptop">laptop</option>
<option value="computer">computer</option>
<option value="dvd">dvd</option>
</select>
    <script>
        $("#product_type").change(function() {
            $(".maindemo3").val("");
        });
    </script>
</body>
</html>

Reset specific input fields using onchange event in JQuery

index.html

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
    <input type="text" class="maindemo1"><br><br>
    <input type="text" class="maindemo2"><br><br>
    <input type="text" class="maindemo3"><br><br>
    <select id="product_type">
<option value="mobile">Mobile</option>
<option value="laptop">laptop</option>
<option value="computer">computer</option>
<option value="dvd">dvd</option>
</select>
    <script>
        $("#product_type").change(function() {
            $(".maindemo2").val("");
        });
    </script>
</body>
</html>

I hope you get an idea about onchange function in jquery.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

onchange function in jquery

Example: jQuery get value of select onChange

Reset input fields using onchange event in JQuery

Reset specific input fields using onchange event in JQuery

Related posts: