javascript - 如果鼠标按下一个孩子，拖动/滑动会产生一个混蛋

Question

我正在编写以下代码来创建基于鼠标的自定义滑动事件。

现在我想在$('.element')启动 'o:swipe' 事件时将值作为值传递给 'mousedown' 事件，以便 'mousedown' 和 'mousemove' 事件仅适用于我为滑动事件选择的元素，而不适用于任何子元素到$('.element').

目前，如果任何孩子被放置在$('.element')then 中，“mousedown”事件将其作为目标，如果单击它，则将其 pageX 位置，但我想要相同的$('.element')，因此我需要从 'o:swipe' 事件传递一个值到'mousedown' 事件。

目前，当单击$('.element').

这是jsbin

$(function(){

    var te = {};

    $('body').on('mousedown', function(e) {

        var ti = e;
        te.target = $(ti.target);
        te.bX = ti.pageX;
        te.lastX = te.target.position().left;

    }).on('mousemove', function(e) {

        te.eX = e.pageX;
        te.position = te.lastX + ( -1 * (te.bX - te.eX));
        te.target.trigger('o:swipe',{ pos : te.position });

    }).on('mouseup', function(e) { te = {}; });


    // ============ SWIPE EVENT SECTION ================

    $('.element').on('o:swipe', function(e, to) {

        $(e.target).closest($(this)).css( 'left' , to.pos + 'px');

    });

});