MouseUp和DoubleClick都使用Backbone js附加到单独的事件处理函数

Question

我有一个图表应用程序，其中我使用Backbone.js在图表图像的不同"区域"上附加鼠标up和双击事件的单独处理程序。

我需要mouseup来检测用户是否点击了图表图像的"区域"部分的左按钮或右按钮，并取决于我重定向我的流程。我还需要双击放大或缩小我的面板包含图表图像。

问题是……因为每次双击隐式调用鼠标，我得到我的最大化/最小化功能干扰左/右按钮点击功能。

我尝试使用各种技术，如超时检查，如果单鼠标向上跟着双击(如建议在以下线程:当检测到双击事件时需要取消click/mouseup事件

这对我不起作用。此外，我有视图的不同对象包含同一页上的图表，所以我附加了唯一的ID与每个事件处理程序来区分它们，我也尝试了简单的标志设置重置方法来检测双击和防止鼠标点击，如果发生双击，但由于在事件层次结构中鼠标点击发生之前，失败了。

总之，请帮忙!提前感谢

Answer 1

按照您链接的答案中给出的建议，您只需要揭穿鼠标启动的回调并检查在给定时间段内是否发生了第二次单击。

假设以这种方式定义的视图(http://jsfiddle.net/nikoshr/4KSZx/)

var V = Backbone.View.extend({
    events: {
        'mouseup button': 'onmouseup',
        'dblclick button': 'ondblclick'
    },
    onmouseup: function() {
        console.log('mouseup');
    },    
    ondblclick: function() {
        console.log('dblclick');
    }
});

你可以修改它并"取消"mouseup事件:

var V = Backbone.View.extend({
    events: {
        'mouseup button': _.debounce(function(e) {
            if (this.doucleckicked) {
                this.doucleckicked = false;
            } else {
                this.onmouseup.call(this, e);
            }
        }, 300),
        'dblclick button': function(e) {
            this.doucleckicked = true;
            this.ondblclick.call(this, e);
        }
    },
    onmouseup: function() {
        console.log('mouseup');
    },    
    ondblclick: function() {
        console.log('dblclick');
    }
});

和一个演示http://jsfiddle.net/4KSZx/6/

Answer 2

不要在backbone.js中使用事件注册。

使用jQuery的事件注册need-to-cancel-click-mouseup-events-when-double-click-event-detected

Answer 3

我不知道我是否明白你说的话，但是…试一试:

$(document).click(function(event) {
    // Page variables of the mouse event
    var pageX = event.pageX;
    var pageY = event.pageY;
    var someFunctions = function() {
        /*
        if(pageX == 300 && pageY == 120) {
            event.preventDefault();
            // do functions
        }
        */
    };
    // start the functions
    someFunctions();
});
$(document).dblclick(function() {
   // functions here to dblclick    
});