javascriptjqueryaudio-player

how to update a range of html using jquery?


I am making a music player and thus wants that as song plays, the progress bar gets modify accordingly using jquery. But my progress bar isnt getting updated.

let myProgressBar = $('#myProgressBar');
audioElement.addEventListener('timeupdate',()=>
{
    var progress= parseInt((audioElement.currentTime/audioElement.duration)*100);
    myProgressBar.value = progress;
});

above is the js code which i tried with. and below is the html code of progress bar

 <input type="range" name="range" id="myProgressBar" min="0" value="0" max="100">

please help me with this


Solution

  • This isn't how you set a value with jQuery:

    myProgressBar.value = progress;
    

    This is:

    myProgressBar.val(progress);