jquery防止mouseup如果mousemove以前被稱爲

Question

我有一個div包含一些span按鈕水平顯示。有太多的按鈕適合在屏幕上，所以我希望用戶能夠點擊並拖動整行按鈕。但是，如果行已被拖動，我不希望該按鈕的mouseup事件觸發。

holder只包含button元素。以下是ASCII碼錶示：

------------------------------- 
| btn | btn | btn | btn | btn | 
------------------------------- 

以下是代碼設置。目前，該按鈕上的mouseup處理程序在持有者處理程序之前被調用（處理程序在冒泡階段被調用），因此在持有者的mouseup處理程序中調用event.preventPropagation()沒有任何幫助。

<div id="holder"> 
    <span class="button"></span> 
</div> 

$('#holder').mousedown(function() { 
    $(document).mousemove(function() { 
     // scroll content of #holder 
    }).mouseup(function() { 
     // stop scrolling 
     $(document).unbind('mouseup').unbind('mousemove'); 
    }); 
}); 

$('.button').mouseup(function() { 
    $('document').mousemove(function() { 
     // do some action here, but only if holder hasn't scrolled on mousedown 
    }); 
}); 

任何想法？

Answer 1

爲什麼不直接使用一個全局變量來控制流量，這樣的事情：

var scrolled = false; 

$('#holder').mousedown(function() { 
    $(document).mousemove(function() { 
     scrolled = true; 
     // scroll content of #holder 

    }).mouseup(function() { 
     // stop scrolling 
     $(document).unbind('mouseup').unbind('mousemove'); 
    }); 
}); 

$('.button').mouseup(function() { 
    $('document').mousemove(function() { 
     if (scrolled == false) { 
      // do some action here, but only if holder hasn't scrolled on mousedown 
     } 
    }); 
});