jQuery ottiene i valori delle caselle di controllo selezionate nell'array

Sto cercando di ottenere i valori di tutte le caselle attualmente selezionate e di memorizzarli in un array. Ecco il mio codice finora:

 $("#merge_button").click(function(event){
    event.preventDefault();
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){
      return $(this).val();
    });
    console.log(searchIDs);
  });

Tuttavia, questo produce più di quanto mi serva. Non solo ottengo i valori, ma alcune altre cose che non voglio.

["51729b62c9f2673e4c000004", "517299e7c9f26782a7000003", "51729975c9f267f3b5000002", prevObject: jQuery.fn.jQuery.init [3], contesto: documento, jquery: funzione ... ", funzione:" 1.9.1], funzione ... "

Vorrei solo ID (primi 3 articoli in questo caso).

Usando $.eache spingendo i valori su un array ottengo l'output desiderato:

$("#find-table input:checkbox:checked").each(function(){ myArray.push($(this).val()); })

["51729b62c9f2673e4c000004", "517299e7c9f26782a7000003", "51729975c9f267f3b5000002"]

Comunque mi piacerebbe usare $.map, dal momento che mi fa risparmiare una riga di codice ed è più carina.

Grazie

Chiama .get()alla fine per trasformare l'oggetto jQuery risultante in un vero array.

$("#merge_button").click(function(event){
    event.preventDefault();
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){
      return $(this).val();
    }).get(); // <----
    console.log(searchIDs);
});

Per la documentazione :

Poiché il valore restituito è un oggetto jQuery, che contiene un array, è molto comune chiamare .get () sul risultato per lavorare con un array di base.

DEMO: http://jsfiddle.net/PBhHK/

$(document).ready(function(){

    var searchIDs = $('input:checked').map(function(){

      return $(this).val();

    });
    console.log(searchIDs.get());

});

Basta chiamare get () e avrai il tuo array come è scritto nelle specifiche: http://api.jquery.com/map/

$(':checkbox').map(function() {
      return this.id;
    }).get().join();

Devi aggiungere .toArray()alla fine della tua .map()funzione

$("#merge_button").click(function(event){
    event.preventDefault();
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){
        return $(this).val();
    }).toArray();
    console.log(searchIDs);
});

Demo: http://jsfiddle.net/sZQtL/

Ho riformattato un po 'il tuo codice e credo di essere arrivato con la soluzione che stavi cercando. Fondamentalmente invece di impostare searchIDscome risultato il .map()ho appena inserito i valori in un array.

$("#merge_button").click(function(event){
  event.preventDefault();

  var searchIDs = [];

  $("#find-table input:checkbox:checked").map(function(){
    searchIDs.push($(this).val());
  });

  console.log(searchIDs);
});

Ho creato un violino con il codice in esecuzione.

     var ids = [];

$('input[id="find-table"]:checked').each(function() {
   ids.push(this.value); 
});

Questo ha funzionato per me!

Gli elementi del modulo indicati nell'HTML erano necessari come array per essere un array nell'oggetto JavaScript, come se il modulo fosse effettivamente inviato.

Se esiste un modulo con più caselle di controllo come:

<input name='breath[0]' type='checkbox' value='presence0'/>
<input name='breath[1]' type='checkbox' value='presence1'/>
<input name='breath[2]' type='checkbox' value='presence2'/>
<input name='serenity'  type='text' value='Is within the breath.'/>
...

Il risultato è un oggetto con:

data = {
   'breath':['presence0','presence1','presence2'],
   'serenity':'Is within the breath.'
}


var $form = $(this),
    data  = {};

$form.find("input").map(function()
{
    var $el  = $(this),
        name = $el.attr("name");

    if (/radio|checkbox/i.test($el.attr('type')) && !$el.prop('checked'))return;

    if(name.indexOf('[') > -1)
    {
        var name_ar = name.split(']').join('').split('['),
            name    = name_ar[0],
            index   = name_ar[1];

        data[name]  = data[name] || [];
        data[name][index] = $el.val();
    }
    else data[name] = $el.val();
});

E qui ci sono tonnellate di risposte che mi hanno aiutato a migliorare il mio codice, ma erano troppo complesse o non volevano esattamente quello che volevo: convertire i dati del modulo in oggetto JavaScript con jQuery

Funziona ma può essere migliorato: funziona solo su array monodimensionali e gli indici risultanti potrebbero non essere sequenziali. La proprietà length di una matrice restituisce il numero di indice successivo come lunghezza della matrice, non la lunghezza effettiva.

Spero che questo abbia aiutato. Namaste!

var idsArr = [];

$('#tableID').find('input[type=checkbox]:checked').each(function() {
    idsArr .push(this.value);
});

console.log(idsArr);

Non utilizzare "ciascuno". Viene utilizzato per operazioni e modifiche nello stesso elemento. Usa "mappa" per estrarre i dati dal corpo dell'elemento e usarlo da qualche altra parte.

qui consente la classe di caselle di controllo sulle pagine e var consente di raccoglierle in un array e è possibile verificare la presenza di true in per il ciclo quindi eseguire singolarmente l'operazione desiderata. Qui ho impostato la validità personalizzata. Penso che risolverà il tuo problema.

  $(".allows").click(function(){
   var allows = document.getElementsByClassName('allows');
   var chkd   = 0;  
   for(var i=0;i<allows.length;i++)
   {
       if(allows[i].checked===true)
       {
           chkd = 1;
       }else
       {

       }
   }

   if(chkd===0)
   {
       $(".allows").prop("required",true);
       for(var i=0;i<allows.length;i++)
        {
        allows[i].setCustomValidity("Please select atleast one option");
        }

   }else
   {
       $(".allows").prop("required",false);
       for(var i=0;i<allows.length;i++)
        {
        allows[i].setCustomValidity("");
        }
   }

});