jQuery Problèmes de la case à cocher

J'ai essayé de créer une fonction jQuery qui sélectionne toutes les cases qui y sont attachées. C'est le code sur lequel j'ai travaillé. Qu'est-ce que je fais mal?jQuery Problèmes de la case à cocher

<div id=checkboxes> 
<input type="checkbox" onclick="toggleChecked(this.checked)"> Select/Deselect All<br> 
<input type="checkbox" />Eggs<br> 
<input type="checkbox" />Butter<br> 
<input type="checkbox" />Milk<br> 
<input type="checkbox" />Bread<br> 
<input type="checkbox" />Jam<br> 
<input type="checkbox" />Tea<br> 
</div> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">     
     function toggleChecked(status) 
      $(document).ready(function(){ 
      $("#checkall").click(function(){ 
      var status = $(this).attr('checked'); 
      $('.checkbox').attr('checked',status); 
      }); 
      }); 
</script>

P.S: J'ai trouvé ce code sur le net. Semblait fonctionner pour tout le monde.

Source

2012-07-06 Shahzeb

Vous ne pouvez pas simplement récupérer le code sur le net et attendez qu'il fonctionne avec votre code html. Que JS fait référence à des éléments qui n'existent pas dans votre code HTML: vous n'avez pas d'élément avec l'identifiant '" checkall "' ou un élément (s) avec la classe '" checkbox "'. – nnnnnn

Je ne l'ai pas fusionné avec mon code. C'est le même code qui a été divisé en différents modules. Je les ai juste arrangés ensemble. – Shahzeb

-1

Cochez cette case link. Cela fonctionne bien ici.

Source

2012-07-06 06:54:50 muthu

Oui. Cela fonctionne bien sur JSFiddle. Mais quand je le copie dans mon HTML et l'exécute sur Chrome, il cesse soudainement de fonctionner. : S – Shahzeb

Avez-vous utilisé le code HTML qui est dans JSFiddle? et est-ce qu'il dit toute erreur dans le chrome? – muthu

A travaillé! : D s'avère que j'avais besoin de mettre dans

Essayez ceci:

<div id=checkboxes> 
<input type="checkbox" id="checkall"> Select/Deselect All<br> 
<input type="checkbox" />Eggs<br> 
<input type="checkbox" />Butter<br> 
<input type="checkbox" />Milk<br> 
<input type="checkbox" />Bread<br> 
<input type="checkbox" />Jam<br> 
<input type="checkbox" />Tea<br> 
</div> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">     
      $(document).ready(function(){ 
       $("#checkall").click(function(){ 
       var status = $(this).attr('checked'); 
       $('input[type="checkbox"]').attr('checked',status); 
       }); 
      }); 
</script>

Ce lie le gestionnaire d'événements, cliquez sur l'élément #checkall sur « la charge » qui est ce que vous voulez et prendre le javascript méthode onclick() hors de l 'élément. De plus, vous avez besoin d'ajouter et d'ID à votre élément Select all pour que le sélecteur fonctionne.

Source

2012-07-06 06:45:20 jaywon

Je pense que u r manque les accolades tout en appelant la fonction ...

function toggleChecked(status) 
    { 
     $(document).ready(function(){ 
     $("#checkall").click(function(){ 
     var status = $(this).attr('checked'); 
     $('.checkbox').attr('checked',status); 
     }); 
     }); 
    }

Source

2012-07-06 06:45:34 sree

Il y a un certain nombre de problèmes. Vous essayez de définir les cases à cocher en fonction d'un sélecteur de classe, mais aucune des cases à cocher n'a la classe. En outre, la fonction document.ready se trouve à l'intérieur de votre gestionnaire d'événements, elle devrait être l'inverse ... Utilisez la méthode prop() au lieu de attr(). Et fixer l'événement correctement, quelque chose comme:

<div id=checkboxes> 
<input id="checkall" type="checkbox"> Select/Deselect All<br> 
<input class="checkbox" type="checkbox" />Eggs<br> 
<input class="checkbox" type="checkbox" />Butter<br> 
<input class="checkbox" type="checkbox" />Milk<br> 
<input class="checkbox" type="checkbox" />Bread<br> 
<input class="checkbox" type="checkbox" />Jam<br> 
<input class="checkbox" type="checkbox" />Tea<br> 
</div> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">     

    $(document).ready(function(){ 
     $("#checkall").on("click", function(){ 
      var status = $(this).is(":checked"); 
      $('.checkbox').prop('checked', status); 
     }); 
    }); 

</script>

Source

2012-07-06 06:47:19 danwellman

Ou vous pouvez faire ceci:

Modifier cette

<input type="checkbox" />

<input type="checkbox" class="checkbox"/>

Source

2012-07-06 06:49:54 Hamidreza

Pour une valeur d'attribut de raison "true" et Les booléens true sont différents pour une case à cocher. De même, "false" et booléen false sont différents.

Voici le fiddle qui décrit cela, essayez de changer le booléen false en "false" et vous comprendrez.

Dans votre question, assurez-vous que vous recevez une valeur booléenne dans une variable d'état.

Source

2012-07-06 06:53:06 Ashwin

Retirer onclick et faire onchange

Source

2012-07-06 06:55:31 Ashwin

Questions connexes

jQuery Problèmes de la case à cocher

Répondre

Questions connexes