在mousedown元素之外捕获mouseup的最佳方法 [英] Best way to catch mouseup outside of mousedown element

问题描述

$('#clickableElement').bind({
    mousedown: function(e)
    {
        console.log('mousedown on element');

        $(document).bind('mouseup',function(e){
            console.log('mouseup caught');

            //Do some magic here 

            $(this).unbind('mouseup');
        });

    },
    mouseup:function(e)
    {
        //mouseup within element, no use here.
    }
});

我正试图从一个元素内部或外部发布的mousedown捕获mouseup事件。这个代码几乎可以工作，但问题是unbind（'mouseup'）解除了附加到mouseup事件（jqueryui）的其他脚本的绑定。如果未设置unbind（），则代码将在mouseup事件中堆叠并调用x次，其中x是您已经拥有的次数。

I'm trying to catch the mouseup event from a mousedown that's released inside or outside of an element. This code almost works, but the problem is the unbind('mouseup') which is unbinding other scripts attached to the mouseup event (jqueryui). If unbind() is not set then the code gets stacked within mouseup event and called x number of times, where x is the times you've mousedowned.

路由1：是否存在某种自毁函数，它会自行调用一次并销毁？

Route 1: is there some kind of self destructing function that calls itself once and destroys?

路由2：在插入代码之前复制/克隆mouseup函数的任何方法，然后取消绑定，然后设置为上一个？

Route 2: any way to copy/clone the mouseup function prior to inserting the code, then unbind, then set as previous?

理想情况下，我想保持这个代码结构的整洁，因为我有很多可点击的元素，所以将document.mouseup绑定到元素之外.mousedown会很乱。

Ideally I'd like to keep this code structure for neatness as I have lots of clickable elements, so binding the document.mouseup outside of element.mousedown would be messy.

这是小提琴我忘记添加 http：// jsfiddle。 net / 9gFNk /

Here's the Fiddle I forgot to add http://jsfiddle.net/9gFNk/

推荐答案

可以给你的点击 event一个命名空间，所以只有那个命名空间的事件才会被绑定，而不是任何其他的

Can giv your click event a namespace so only that namespaced event gets unbound, and not any others

   $(document).on('mouseup.clickableElement',function(e){
        console.log('mouseup caught');

        //Do some magic here 

        $(this).off('mouseup.clickableElement');
    });

这篇关于在mousedown元素之外捕获mouseup的最佳方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！