2011-10-05 5 views
4

je le bit suivant de jquery:jQuery draggable div avec un div incorporé avec un gestionnaire de clic. Comment arrêter le gestionnaire de clic de tir

http://jsfiddle.net/tad604/Ck2qk/10/

Je veux le gestionnaire de clic de div foo de ne pas tirer, lorsque vous cliquez et faites glisser. J'ai essayé de faire toutes sortes de choses à l'intérieur des événements stop/start du drag (event.stopPropagation() etc) en vain. Le gestionnaire de clic est déclenché après l'événement de glisser indépendamment.

Répondre

4

C'est ennuyeux, mais la seule solution est de supprimer l'événement en début de glissement et de le remettre en arrêt de glissement. Essayez ceci:

$(".foo").click(function(){ 
    alert("blah"); 
}); 
$(".bar").draggable({ 
    stop: function(event) { setTimeout(function() { 
     $(".foo").click(function(){ 
      alert("blah"); 
     }); }, 100)}, 
    start: function(event) { $('.foo').unbind('click'); }     
}); 

Maintenant, il reste le problème que vos événements de clic sont probablement un peu plus compliqué que cela, et vous ne voulez probablement pas avoir à les réécrire. Vous pouvez enregistrer les événements pour plus tard en utilisant les données jquery comme ceci:

var events = $ ('# test'). Data ("événements");

Vous pouvez également utiliser la fonction jquery live pour attacher l'événement click afin que l'événement soit uniquement lié à un élément correspondant à ce sélecteur. Cela signifie que si vous modifiez la classe en la faisant glisser, de sorte qu'elle ne correspond plus à ce sélecteur, elle n'aura plus cet événement click. Quelque chose comme cela pourrait fonctionner:

$(".bar .foo").live('click', function(){ 
    alert("blah"); 
}); 
$(".bar").draggable({ 
    stop: function(event) { setTimeout(function() { 
    $(".draggableBar").removeClass('draggableBar').addClass('bar'); 
    }, 100)}, 
    start: function(event) { $(this).removeClass('bar').addClass('draggableBar'); }     
}); 

Vous auriez également mettre à jour le css si draggablebar obtient le même style que bar.

+0

Cela fonctionne, malheureusement mon cas d'utilisation réel est loin d'être aussi simple que l'exemple inventé que je montre. Un objet passe à une fonction qui rend les objets glissables et ils ont tous leurs propres éléments internes avec des gestionnaires onclick multiples/différents. Existe-t-il un moyen de délier la fonction? et le mettre dans un autre champ sur l'objet? pour que je puisse le relier plus tard? – tad604

+0

Edited ma réponse avec quelques suggestions, j'espère qu'ils aident! – Porco

Questions connexes