jQuery change even fires only when the event stops( Please check the snippet demo)

As you can see the console.log( $(this).val()) triggers only when the range input stops. Can you please let me know how I can make this more interactive in way that we can get the current value of input type="range" live and simultaneously as it change (Step by Step)

$("input").on("change", function(event){
  console.log( $(this).val())
 });  

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="range" min="0" value="100" max="600">
          

CodePudding user response：

You should use 'input' instead of 'change' as a function parameter. I edited the code as follows:

$("input").on("input", function(event){
  console.log( $(this).val())
 });  

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="range" min="0" value="100" max="600">