删除滚动条上的事件

Question

我制作了一个可滚动的div，其中添加了一些内容 如果用户在此DIV中单击，我想触发一个事件。 的 HTML

<div id="mainDiv">
    ... some content..
</div>

JS

$(document).mousedown(function(e){
    var clickedElemet = $(e.target);
    if(clickedElemet.is($("#mainDiv"))){
      alert("mainDiv clicked"); // alert is getting called if we click on scrollbar
    }
})

现在问题是当用户点击滚动条手柄时，事件被解雇了 如果用户点击滚动条手柄，我怎么能阻止事件呢？ 请注意，如果我使用 CLICK 事件，这样可以正常使用。

  

请注意，我无法更改DOM结构，只能使用mousedown事件。

Demo

Answer 1

您需要点击X position，然后检查点击X position是否超出滚动条X position。

请参阅 JSFiddle 中的演示。

注意：这在浏览器放大和缩小时无法正常工作。