L'événement jQuery click se déclenche toujours sur l'élément filtré

Question

J'essaie de filtrer les événements de bouton en fonction de leur affectation ou non à une classe CSS.

Supposons que j'ai un bouton comme ceci:

<button id="save-button" class="ui-state-default ui-corner-all">Save</button> 

Je veux obtenir jQuery pour sélectionner tous les boutons qui actuellement se font pas une classe de « handicapée ui-état ». Le sélecteur J'utilise ressemble à ceci:

$('#save-button:not(.ui-state-disabled)').click(function() { 
    ... 
}); 

Lorsque le bouton est cliqué, je vais appeler une autre fonction, faire des choses, puis ajoutez la classe « handicapée état-ui » au bouton. Cependant, le bouton continue d'accepter les événements de clic.

Je devine que cela est à cause de deux causes possibles:

1. Le liant événement ne porte que sur l'état initial lors de la liaison de l'événement clic et ne reconnaît pas qu'une nouvelle classe a été ajoutée plus tard
2. Mon filtre [ » ...: non (.ui-état désactivé)] est incorrect

Toute observation?

Answer 1

Vous pouvez utiliser .live() pour faire ce que vous voulez, comme ceci:

$('#save-button:not(.ui-state-disabled)').live('click', function() { 
    ... 
}); 

Ou, vérifiez la classe lorsque les feux de gestionnaire click, comme celui-ci:

$('#save-button').click(function() { 
    if($(this).hasClass('ui-state-disabled')) return; 
    ... 
}); 

Votre # 1 est correct pour la raison, le sélecteur trouve les éléments qui correspondent à ce moment-là et lie un gestionnaire de clic pour eux ... peu importe quelles classes ou ID ils ont plus tard, le gestionnaire est lié à l'élément. .live() écoute les bulles et vérifie que le sélecteur correspond lorsque l'événement arrive, donc ça marche ... ou vous vous vérifiez dans le gestionnaire click comme je l'ai dans la deuxième option ci-dessus.