javascript - mousedown 事件没有发生

Question

在下面的代码片段中，只有“mousemove”事件有效。 'mousedown' 没有效果，我无法解释为什么会这样。如果我将“mousedown”替换为“click”，它确实有效，但是我想使用 mousedown 以便 fadeOut 事件立即发生(在单击开始时，而不是使用依赖于用户鼠标向下然后返回的 click上。

$('.issue-carousel').on({
    // On mousemove, controls follow cursor
    mousemove: function(e) {
        var parentOffset = $(this).offset();
        var relX = e.pageX - parentOffset.left;
        var relY = e.pageY - parentOffset.top;
        $('.drag-indicator').css({
            left: relX,
            top: relY
        });
    },
    mousedown: function() {
       $('.drag-indicator').fadeOut(300);
    }
});

Answer 1

根据我的评论，您的代码工作正常 - 只有一个异常(exception)。 mousedown fadeout 不起作用，因为从技术上讲，您点击的不是旋转木马，而是 拖动指示器。我已经按照下面的代码更新了相应的 mousedown 目标；

$('.issue-carousel').on({
    // On mousemove, controls follow cursor
    mousemove: function(e) {
        var parentOffset = $(this).offset();
        var relX = e.pageX - parentOffset.left;
        var relY = e.pageY - parentOffset.top;
        $('.drag-indicator').css({
            left: relX,
            top: relY
        });
    }
});

$('.drag-indicator').on({
    mousedown: function(e){
    $(this).fadeOut(300);
  }
})

可以在这里找到一个可用的 fiddle :https://jsfiddle.net/o3cdLjp7/2/