HTML5 seekBar在单击后不更新，尽管更新了其值

我已经挖掘了一段时间，寻找为什么seekBar在被点击后没有更新，到目前为止没有运气。我在Chrome上这么做是因为Firefox本身不支持HTML5音频标签

以下是我得到的基本信息：

<script>
  var seekBar;
  var player;
  function initPlayer(){
    seekBar = document.getElementById('seekBar');
    player = document.getElementById('playcontrol');
    seekBar.setAttribute('max', player.duration);
    player.addEventListener('timeupdate', function(){
      seekBar.setAttribute('value', player.currentTime);
    });
  }
</script>
...
<audio id="playcontrol" src="Song.mp3" preload="auto"></audio>
<input id="seekBar" type="range" step="any" onchange="player.currentTime = this.value" min="0" max="10" value="0">

我在页面加载后运行initPlayer并运行player.play；在控制台上启动音频。这一切都很好，直到我手动点击seekBar中的一个位置

当我这样做时，它会像应该的那样跳转到音频部分，但是，即使值属性继续得到更新，视觉栏的位置也不再改变

---

为什么点击后视觉位置是静态的？是否有一些黑客或解决方法来修复此问题？

您可以提供JSFIDLE吗？您可以提供JSFIDLE吗？