Bootstrap 4.3 Slider - how to catch event during slide with jQuery?

Question

I am trying to catch the value of the slider during the slide . I can get it when the slide is released, with the new value, but I cannot seem to find the right event that is triggered during the slide. Looked online but mainly the resources push you to include other libraries. Is there a simple way to do this with standard Bootstrap components and events?

HTML

  <div class="custom-control custom-range">
        <input id="IDbuttonTBD4" class="custom-range" type="range">
        <label for="IDbuttonTBD4"></label>
   </div>

JSS

$("#IDbuttonTBD11").change(function (e) {
    var selection = $(this).val();

    // rest of the code here...
});

Answer 1

Use the input change listeners:

 $(document).ready(function() { const $value = $('#slider'); $value.on('input change', () => { console.log($value.val()); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/> <label for="slider">Range 0 - 100</label> <input type="range" class="custom-range" id="slider">