jQuery unbind cliquez sur l'événement de la fonction et de re-joindre en fonction de la situation

Le code ci-dessous-je utiliser pour créer un menu coulissant. J'ai besoin de savoir comment séparer la fonction attachée à l'événement de clic et de les rattacher à un autre moment. (à l'aide de jQuery 1.7.2)

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(function(){
      if($(this).next('.section').is(':visible'))
      {
        $('.section:visible').slideUp()              
        $('.arrows:visible').attr("src","right.gif")
      }
      else
      {
        $('.section').slideUp();
        $(this).next('.section').slideToggle();
        $(this).find('.arrows').attr("src","down.gif")
    });
});

Le code ci-dessous est ce que j'ai jusqu'à présent

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
     $('.header').unbind('click');
   }
   else
   {
     //else re-attach functionality?
   }
});

Grâce

Si vous voulez simplement prendre le gestionnaire d'événements click pour $('.header') ou désactiver la fonction sur certains formVersion valeur?
Eh bien oui, mais comment puis-je me réfère à la fonction de clic dans le premier bloc de code pour re-joindre?
double possible de Comment faire pour désactiver temporairement un gestionnaire de clic en jQuery?
Peut-être que je devrais essayer et ré-engager mon cerveau avec du café et de la nourriture plutôt que de se poser des questions idiotes sur un vendredi après-midi, non seulement il était une question stupide, mais celui qui a déjà été demandé 🙁

OriginalL'auteur Mark Walters | 2012-04-27

7

Tout simplement faire un nom de fonction. Vous pouvez aller low tech ici et de retour à la base pour détacher et rattacher des événements spécifiques.
```
function doStuff()
{
    if($(this).,next('.section').is(':visible'))
        ...
}

$('.header').on('click', doStuff);
$('.header').off('click', doStuff);
```
Merde, tu m'as devancé par 30 secondes XD
C'est tellement simple que c'est même pas drôle. Grâce Tejs
Il serait agréable d'être en mesure d'obtenir un traitement de la dernière lié fonction sans avoir à utiliser le fn nom. Comme elem.on('click', myfn). Puis ailleurs complètement indépendants nous pourrions avoir var fn = elem.lastClickHandler(), elem.off('click', fn), // some code without handler, elem.on('click', fn)

OriginalL'auteur Tejs
2

Au lieu de les séparer et de re-lier, je vous suggère d'ajouter une classe simple pour .header et de vérification de la classe dans le gestionnaire de clic. Voir ci-dessous,
```
$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
     $('.header').addClass('dontClick');
   } else  {
     $('.header').removeClass('dontClick');
   }
});
```
Et dans votre .header cliquez sur gestionnaire,
```
$('.header').click(function(){
     if ($(this).hasClass('dontClick')) {
        return false;
     }
     //rest of your code
```
Si vous insistez pour avoir un délier et de lier, vous pouvez déplacer le gestionnaire à une fonction et à délier/lier la fonction de n'importe quel nombre de temps..

Merci j'aime aussi cette version, encore quelque chose que je n'avais pas pensé à faire.
lier/délier un gestionnaire d'événements est beaucoup de travail que de simplement l'ajout et la suppression d'une classe. C'est une technique courante, mais encore une fois c'est à vous de choisir la méthode que vous voulez suivre.
Comment est Tjes idée d'utiliser .on() et .off() et de nommer à la fonction de beaucoup de tracas? J'aime bien les deux idées et je n'ai upvote votre réponse! 🙂
upvote n'a pas d'importance.. je viens de dire que bind/relier un gestionnaire d'événement est cher que l'ajout d'une classe et la suppression d'une classe.
Qu'entendez-vous par cher? parce que vous avez dit que c'était beaucoup de travail avant, à laquelle je suis en désaccord je pense en fait que pour moi à mettre en œuvre (bien que minime) il y a un peu plus à faire avec votre code?

OriginalL'auteur Selvakumar Arumugam

Vous pouvez essayer quelque chose comme cela.

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
       $('.header').addClass('clickDisabled');
   }
   else
   {
       $('.header').removeClass('clickDisabled');
   }
});

Et puis dans le gestionnaire de clic vérifier cette classe.

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(function(){
        if(!$(this).hasClass('clickDisabled')){
            ...
            ...
        }
    });
});

Imagine que notre recommandation n'est pas considéré comme 🙂
Hmmmm...il y a différentes façons de le faire...mais nos pensées match 🙂

OriginalL'auteur ShankarSangoli

0

Pourquoi ne pas faire que de la section supérieure d'une fonction, puis l'appeler dans ton else?

OriginalL'auteur Adam Sweeney
0

Vous pourriez essayer de définir une variable comme un drapeau. var canClick = ($('#formVersion').val() != 'Print'); Ensuite dans le gestionnaire de clic pour votre .header éléments de vérifier pour voir si canClick est vrai avant l'exécution de votre code.

Si vous souhaitez supprimer le gestionnaire vous pouvez attribuer les événements de l'objet à une variable. var eventObj = #('.header').data('events'); Qui vous donnera un objet avec tous les gestionnaires affectée à cet objet. Pour réaffecter l'événement click ce serait comme $('.header').bind('click', eventObj.click[0]);

OriginalL'auteur hradac
0

Après avoir essayé si dur avec bind, unbind, sur, de, sur, attr, removeAttr, prop j'ai fait le travail.
Donc, j'ai le scénario suivant: Dans mon code html, je n'ai PAS connecté le inline onclick gestionnaires.

Ensuite dans mon Javascript, j'ai utilisé les méthodes suivantes pour ajouter une ligne onclick gestionnaire:
```
$(element).attr('onclick','myFunction()');
```
Pour supprimer ce à un moment plus tard à partir de Javascript, j'ai utilisé les éléments suivants:
```
$(element).prop('onclick',null);
```
C'est la façon dont il a travaillé pour moi de lier et de délier sur les événements dinamically en Javascript. Rappelez-vous de ne PAS insérer d'inline onclick gestionnaire de vos éléments.

Quelques problèmes avec ce, tout d'abord, vous êtes à l'aide de deux méthodes différentes pour fixer et annuler le onclick gestionnaire. Quel est le problème avec l'aide de .prop pour les deux? deuxièmement, Il n'est pas une bonne pratique pour passer d'une "chaîne" de référence à une fonction que vous avez fait dans votre première ligne, d'autant que je suis conscient que cela conduit à un appel à eval() qui est mal! 🙂
en bref, je pense qu'il utilise attr correctement pour définir le onclick, et est obligé d'utiliser prop pour supprimer par IE. À partir du jQuery "removeattr" docs: "Remarque: la Suppression d'une ligne onclick gestionnaire d'événement à l'aide .removeAttr() ne permet pas d'obtenir l'effet désiré dans Internet Explorer 6, 7 ou 8. Pour éviter d'éventuels problèmes, utiliser .prop() au lieu de:"
merci pour la correction

OriginalL'auteur bboydflo

-2

Vous pourriez mettre tout le code sous la .click dans un coin de la fonction

function headerClick(){
  if($(this).next('.section').is(':visible'))
  {
    $('.section:visible').slideUp()              
    $('.arrows:visible').attr("src","right.gif")
  }
  else
  {
    $('.section').slideUp();
    $(this).next('.section').slideToggle();
    $(this).find('.arrows').attr("src","down.gif")
  }
}

et liez-le comme ceci:

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(headerClick);
});

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
       $('.header').unbind('click');
   }
   else
   {
       $('.header').click(headerClick);
   }
});

'séparer' fonction délie les fonctions qui sont lier à l'aide de jquery 'bind' méthode.

OriginalL'auteur DangerMonkey

Vous devez vous connecter pour publier un commentaire.