J'ai une liste de cases à cocher à l'intérieur d'une table avec une simple fonction jQuery qui permet à l'utilisateur de cliquer n'importe où dans la ligne de table pour vérifier / décocher la case. Cela fonctionne bien, sauf lorsque l'utilisateur clique sur la case à cocher. Ça ne marche pas alors. Des idées? Voici mon code:
html: jQuery:
4 Réponses :
sans le HTML montrant pourquoi cette fonction est déclenchée par elle est difficile à dire. Un Jsfiddle serait utile. Seulement des spéculations, mais pourriez-vous être que vous cliquez sur la case à cocher qui le contrôle, mais l'événement de clic appelle immédiatement cette fonction qui le décochez la case?
Je viens de mettre à jour le code pour montrer comment j'appelle la fonction de la HTML.
Vous ne m'avez toujours pas montré la chose la plus importante; Est votre case à cocher dans le
A manqué de caractères ... J'essaierais de faire des Jsfiddles de la solution, mais je suis sur le point de rencontrer quelqu'un pendant un jour d'escalade, alors je n'ai donc pas le temps maintenant. Peut-être que lorsque je reviens ce soir (heure du Royaume-Uni), j'aurais pu aller si vous n'avez toujours pas de solution.
Également (étrangement) Je ne peux pas obtenir votre code pour travailler lorsque le JS était dans la boîte JS sur Jsfiddle. Cela peut être parce que vous n'utilisez pas la liaison $ (SELECTOR) .Cliquez sur la liaison (fonction) qui est la voie habituelle d'événements de liaison aux éléments HTML lors de l'utilisation de JQuery. Voir ici: API.JQUERY.com/Click
Vous pouvez utiliser événement.stoppropagation pour éviter votre < Code> Entrée # MyContacts S Cliquez sur l'événement se propage dans l'événement TR S Cliquez sur. En outre, je ne peux pas croire que vous mélangez JQuery and Dom de cette façon, lorsque vous devriez utiliser des événements JQuery.
Une autre solution (en utilisant moins de script) est de rendre le script tirant uniquement lorsque l'étiquette est cliquée, plutôt que la ligne entière contenant la case à cocher.
Merci beaucoup pour votre aide! Je suis un débutant JQuery.
<tr class="checkBox">...</tr>
$(document).ready(function () {
$('tr.checkBox').live('click', function (e) {
if (e.target.type !== 'checkbox') {
$('input#myContacts').attr("checked", function () {
return !$(this).prop('checked');
});
//Or
$(this).find('input#myContacts').attr("checked", function () {
return !$(this).prop('checked');
});
}
});
});
solution 1: http://jsfiddle.net/qmdgk/3/ (en utilisant deux table cellules mais seulement la liaison cliquez sur la cellule de texte)
Solution 2: http://jsfiddle.net/qmdgk/4/ (en utilisant stoppropagation ( ) Sur la case à cocher, cliquez sur Event)
Les deux utilisent JQuery pour lier l'événement à l'élément qui est préféré.
Où est la case à cocher #myContacts? Post détaillé HTML
@John Anderson: Alexander a un point; Il y a plus d'une solution valide ici. Si vous avez besoin d'une clarification supplémentaire, demandez-le, sinon acceptez une réponse.