如何在Jquery中获取复选框的ID

Question

I need to get the id from each checked checkbox. Right now I am able to get the sum which is great but I cant seem to get each id.

<input name="pay" class="pay_me" id="4" type="checkbox" value="6.00" />
<input name="pay" class="pay_me" id="5" type="checkbox" value="9.00" />
<input name="pay" class="pay_me" id="6" type="checkbox" value="3.00" />
<input name="pay" class="pay_me" id="9" type="checkbox" value="23.00" />

Jquery

$(document).ready(function() {
    $('.pay_me').change(

    function() {
        var t_payme = 0;
        $('.pay_me:checked').each(function() {
            t_payme += parseFloat($(this).val());
        });
        t_payme = parseFloat(t_payme).toFixed(2);
        $('#to_payme').val(t_payme);
    });
});​

With this I can the sum to my textbox

<input name="to_payme" id="to_payme" type="text" value="0.00" />

I also need the checked ID numbers like this 4|6|9 in an additional textbox

<input name="ids_to_update" id="ids_to_update" type="text" value="" />

Answer 1

You can get element ID with this.id (or $(this).prop("id") ). Use array to store IDs like here:

$(document).ready(function() {
    $('.pay_me').change(function() {
        var t_payme = 0, checked = [];
        $('.pay_me:checked').each(function() {
            t_payme += parseFloat($(this).val());
            checked.push(this.id);
        });
        t_payme = t_payme.toFixed(2);
        $('#to_payme').val(t_payme);
        $('#ids_to_update').val(checked.join("|"));
    });
});​

DEMO: http://jsfiddle.net/rA5cv/

Answer 2

Here you go:

$(document).ready(function() {
    $('.pay_me').change(function() {
        var t_payme = 0, ids = [];
        $('.pay_me:checked').each(function() {
            ids.push(this.id);
            t_payme += parseFloat($(this).val());
        });
        t_payme = parseFloat(t_payme).toFixed(2);
        $('#to_payme').val(t_payme);
        $('#ids_to_update').val(ids.join('|'));
    });
});

on jsFiddle

Answer 3

Keep track of the IDs in an array:

var ids = [];
$('.pay_me:checked').each(function () { 
    t_payme += parseFloat($(this).val()); 
    ids.push($(this).attr("id"));
});

//now do something with the array of IDs...