javascript - 如何在javascript中获取进度条的x坐标

Question

我正在尝试使用 JavaScript 设置进度条的宽度，但无法获得正确的进度条宽度。

<div id="defaultBar"> 
  <div id="progressbar"></div>
</div>


var bar = document.getElementById("defaultBar");
var progressBar = document.getElementById("progressbar");
    bar.addEventListener("click", clickBar, false);

function clickBar(event){
    var x = event.pageX - bar.offsetLeft;
    var time = x * audio.duration/barSize;
    audio.currentTime = time;
    progressBar.style.width = x + 'px';
}

Answer 1

尝试:

 var x = event.offsetX 

获取该事件和目标节点的填充边缘之间的鼠标指针的 X 坐标。