You can get the coordinates of where you clicked inside of the element like this:(您可以像这样在元素内部获取单击位置的坐标：)
Just subtract the offset position of the element from the coordinate of where the page was clicked.(只需从单击页面的坐标中减去元素的偏移位置即可。)
Updated Example(更新示例)
document.getElementById('progressBar').addEventListener('click', function (e) {
var x = e.pageX - this.offsetLeft, // or e.offsetX (less support, though)
y = e.pageY - this.offsetTop, // or e.offsetY
clickedValue = x * this.max / this.offsetWidth;
console.log(x, y);
});
If you want to determine whether the click event occurred within the value range, you would have to compare the clicked value (in relation to the element's width), with the the value attribute set on the progress element:(如果要确定click事件是否在值范围内发生，则必须将clicked值（相对于元素的宽度）与progress元素上设置的value属性进行比较：)
Example Here(这里的例子)
document.getElementById('progressBar').addEventListener('click', function (e) { var x = e.pageX - this.offsetLeft, // or e.offsetX (less support, though) y = e.pageY - this.offsetTop, // or e.offsetY clickedValue = x * this.max / this.offsetWidth, isClicked = clickedValue <= this.value; if (isClicked) { alert('You clicked within the value range at: ' + clickedValue); } });
<p>Click within the grey range</p> <progress id="progressBar" value="5" max="10"></progress>
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
