jquery cases à cocher, comment obtenir toutes les cases à cocher sélectionnées et les ajouter à la matrice?

Question

Salut J'ai la page suivante:

<input type="checkbox" name="fruit1" id="1" class="box">Banana<br /><br /> 
<input type="checkbox" name="fruit2" id="2" class="box">Cherry<br /><br /> 
<input type="checkbox" name="fruit3" id="3" class="box">Strawberry<br /><br /> 
<input type="checkbox" name="fruit4" id="4" class="box">Orange<br /><br /> 
<input type="checkbox" name="fruit5" id="5" class="box">Peach<br /><br /> 
<input type="button" id="groupdelete" value="clickme"><br /> 

$(document).ready(function(){ 

$('#groupdelete').on('click', function(){ 
    var names = []; 
    $('input:checked').each(function() { 

     names.push($('input:checked').attr("name") + $('input:checked').attr('id')); 

}); 
    console.log(names); 
}) 

}) 

Ce que je suis en train de faire est la suivante:

Pour ajouter les cases à cocher cochées dans le tableau . Et après cela, je voudrais être en mesure de transmettre la valeur en variable php.

Quand j'Excecute le code maintenant, je reçois résultat comme ceci:

[ "fruit22", "fruit22", "fruit22"]

Toute aide sera grandement appréciée.

Cordialement, Zoreli

Answer 1

Vous devez utiliser this plutôt que 'input:checked' dans la fonction .each() pour faire référence à l'élément courant dans l'ensemble en cours d'examen. Si vous réutilisez le sélecteur, vous récupérez l'ensemble, puis vous obtenez uniquement les attributs de l'élément dans l'ensemble.

$('input:checked').each(function() { 
    names.push($(this).attr("name") + this.id); 
}); 

Answer 2

Changer votre code html à

<input type="checkbox" name="fruits[]" id="1" class="box">Banana<br /><br /> 
<input type="checkbox" name="fruits[]" id="2" class="box">Cherry<br /><br /> 
<input type="checkbox" name="fruits[]" id="3" class="box">Strawberry<br /><br /> 
<input type="checkbox" name="fruits[]" id="4" class="box">Orange<br /><br /> 
<input type="checkbox" name="fruits[]" id="5" class="box">Peach<br /><br /> 
<input type="button" id="groupdelete" value="clickme"><br /> 

Et maintenant, regardez jQuery/Javascript

$(document).ready(function(){ 
    $('#groupdelete').click(function() { 
     var marked = new Array(); 
     var k = 0; 
     $('input:checked').each(function(index,value) { 
      marked[k] = value; 
      k++; 
     });   
     alert(marked[0].id); 
    }); 
}); 

alerte vous donne juste la démo en accédant à l'accès direct à l'index du tableau.