Jquery 进度条：跳到一个点

我试图为音频制作一个尽可能简单的进度条。我能做一个播放和停止按钮，它工作了。我能够用一个简单的动画制作进度图。（这首歌有30秒，我设置了30毫秒的动画。）现在我遇到了这个问题：

当我点击酒吧的那一部分时，我怎么能进入歌曲的任何地方

（我不想要任何插件。我试着自己做每件事并理解每一步）

下面是要播放的代码：

HTML:

JQUERY：

$(function(){       
    $("#play").click(function() {
      $("#audio").trigger('play');
      $("#indicator").animate({"width": "150px"}, 30000);
    });

    $("#stop").click(function() {
      $("#audio").trigger('pause');
      $("#indicator").stop();
    }); 
});

---

如果您的问题是捕捉鼠标单击的位置，请尝试以下操作：

$("#progressbar").mouseup(function(e){
    var leftOffset = e.pageX - $(this).offset().left;
    var songPercents = leftOffset / $(this).width;
    var audio = $('audio');
    audio.currentPosition = songPercents * audio.duration;
});

---

我还没有试过，所以我不确定它在第一次尝试时是否会起作用，但它应该给你一个开始。

它不起作用，但它给了我一些可以尝试的东西。谢谢

$(function(){       
    $("#play").click(function() {
      $("#audio").trigger('play');
      $("#indicator").animate({"width": "150px"}, 30000);
    });

    $("#stop").click(function() {
      $("#audio").trigger('pause');
      $("#indicator").stop();
    }); 
});

$("#progressbar").mouseup(function(e){
    var leftOffset = e.pageX - $(this).offset().left;
    var songPercents = leftOffset / $(this).width;
    var audio = $('audio');
    audio.currentPosition = songPercents * audio.duration;
});