webentwicklung-frage-antwort-db.com.de

Verwenden von jQuery, um den Wert mehrerer Kontrollkästchen abzurufen und als durch Kommas getrennte Zeichenfolge auszugeben.

Ich habe viele Checkboxen wie folgt: 

<li><input type="checkbox" name="areaofinterest" value="home_coo" id="home_coo" class="Checkbox" > Cooking</li>
    <li><input type="checkbox" name="areaofinterest" value="home_cra" id="home_cra" class="Checkbox"> Crafts</li>
    <li><input type="checkbox" name="areaofinterest" value="home_dec" id="home_dec" class="Checkbox"> Decorating</li>
    <li><input type="checkbox" name="areaofinterest" value="home_ent" id="home_ent" class="Checkbox"> Entertaining</li>
    <li><input type="checkbox" name="areaofinterest" value="home_gar" id="home_gar" class="Checkbox"> Gardening</li>
    <li><input type="checkbox" name="areaofinterest" value="home_hom" id="home_hom" class="Checkbox"> Home Improvement</li>
    <li><input type="checkbox" name="areaofinterest" value="home_mar" id="home_mar" class="Checkbox"> Marriage</li>
    <li><input type="checkbox" name="areaofinterest" value="home_par" id="home_par" class="Checkbox"> Parenting</li>
    <li><input type="checkbox" name="areaofinterest" value="home_pet" id="home_pet" class="Checkbox" > Pets</li>
    <li><input type="checkbox" name="areaofinterest" value="home_ret" id="home_ret" class="Checkbox"> Retirement</li>

Wie kann ich jQuery verwenden, um die geprüften Werte zu erhalten und als areaofinterest = "home_coo, home_mar, home_pet" auszugeben? 

Danke vielmals.

jquerycheckbox
24
Frank

Verwenden Sie die Funktion .map() :

$('.Checkbox:checked').map(function() {return this.value;}).get().join(',')

Das brechen:

$('.Checkbox:checked') wählt die markierten Kontrollkästchen aus.

.map(function() {return this.value;}) erstellt ein jQuery-Objekt, das ein Array enthält, das die Werte der aktivierten Kontrollkästchen enthält.

.get() gibt das tatsächliche Array zurück.

.join(','); fügt alle Elemente des Arrays zu einem durch Komma getrennten String zusammen.

Working DEMO

101
Anthony Grist
var areaofinterest = '';

$('[name="areaofinterest"]')​.each(function(i,e) {
    var comma = areaofinterest.length===0?'':',';
    areaofinterest += (comma+e.value);
})​;

So erhalten Sie nur markierte Kästchen:

var areaofinterest = '';

$('[name="areaofinterest"]')​.each(function(i,e) {
    if ($(e).is(':checked')) {
        var comma = areaofinterest.length===0?'':',';
        areaofinterest += (comma+e.value);
    }
})​;

GEIGE

Sie könnten auch tun:

var areaofinterest = [];
$('[name="areaofinterest"]:checked').each(function(i,e) {
    areaofinterest.Push(e.value);
});

areaofinterest = areaofinterest.join(',');

Und es gibt wahrscheinlich eine Reihe anderer Möglichkeiten, dies zu tun?

3
adeneo
 var mode = [];
            jQuery("input[name='mode[]']:checked").each(function(i) {
                mode.Push($(this).val());
            });
1
kush
var values = "";
$("checkbox[name=areaofinterest]").each(function() { 
    values += $(this).val() + ",";
});

values = values.substring(0, values.length - 2);
0
ŁukaszW.pl

Verwenden von jQuery, um den Wert mehrerer Kontrollkästchen abzurufen und als durch Kommas getrennte Zeichenfolge auszugeben.

var programming = $("input[name='programming']:checked").map(function() {
    return this.value;
}).get().join(', ');

alert("My favourite programming languages are: " + programming);

    OR

var favProgramming = [];
$.each($("input[name='programming']:checked"), function(){            
    favProgramming .Push($(this).val());
});

alert("My favourite programming languages are: " + favProgramming);

FÜR DEMO HIER

0
Developer

Versuchen Sie etwas so:

var areaofinterest= "";

$("input[type=\"checkbox\"]").each(function() {
    if ($(this).attr("checked")) {
        if (areaofinterest !== "") areaofinterest += ",";

        areaofinterest += $(this).value();
    }
});
0
Paul Aldred-Bann

Oder Sie können ein Array wie unten gezeigt verwenden

 var checkBoxArray = new Array();
 var areaofinterest = '';

 $(':checkbox:checked').each(function(i){
        checkBoxArray .Push($(this).attr("value"));

});

  if (checkBoxArray .length == 0) {
     } else {
     while (checkBoxArray .length != 0) {
            if (checkBoxArray .length == 1) {
                areaofinterest += checkBoxArray .pop();
            } else {
                areaofinterest += (checkBoxArray .pop() + ",");
                 }
            }
}
console.log(areaofinterest);

sie erhalten jedoch String in umgekehrter Reihenfolge.

0
Anurag