jquery empêche mouseup si mousemove a déjà été appelé

Question

J'ai un div contenant un certain nombre de boutons span affichés horizontalement. Il y a trop de boutons pour tenir sur l'écran, donc je veux que l'utilisateur puisse cliquer et faire glisser toute la rangée de boutons. Cependant, je ne veux pas que l'événement mouseup du bouton se déclenche si la ligne a été déplacée. Le holder ne contient que button éléments. Voici la représentation ASCII:

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

Voici la configuration de code. Actuellement, le gestionnaire mouseup sur le bouton est appelé avant le gestionnaire sur le support (les gestionnaires étant appelés dans la phase de bouillonnement), donc l'appel event.preventPropagation() dans le gestionnaire mouseup du support ne aide pas.

<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 
    }); 
}); 

Des idées?

Answer 1

Pourquoi ne pas simplement utiliser une variable globale pour contrôler le flux, quelque chose comme ceci:

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 
     } 
    }); 
});