获取“对象HTMLInputElement”的值和函数错误

Question

I have checkboxes on a page and I get the checked ones then I loop through them;

var checkeds = $('#accTypes input:checked');
    var values = "";

    for (var i = 0; i < checkeds.length; i++) {
        console.log(checkeds[i]);
        var cval = checkeds[i].val();
        values = values + "," + cval;
    }

I recognized that the row below causes error.

checkeds[i].val()

When I print the checkeds[i] variable in chrome console, I see;

<input type=​"checkbox" name=​"accom-check" id=​"checkboxP12" value=​"12">​

I wanted to get the value of checkeds[i] variable. How can I do this?

Answer 1

A jQuery collection is an array-like object containing native DOM nodes.

When you access it as checkeds[1] you get the native DOM node, not the jQuery version, so it doesn't have a val() method.

Either use the native value

var cval = checkeds[i].value;

or use eq() to get the jQuery object

var cval = checkeds.eq(i).val();

As a sidenote, you could do the same thing with a map

var values = $('#accTypes input:checked').map(function() {
    return this.value;
}).get().join(',');