如何在单击按钮时获得最后一个复选框选中值

Question

我想在单击按钮时仅获取上次选中复选框的值，我使用了以下脚本但没有获取上次选中复选框的值。

1 ( 方法

    $('#close_btn').click(function(){
    var checkedIds = $(".chkIt:last:checked").each(function() {
            return this.class;
     });
});
    console.log(checkedIds)

2 ( 方法

$('#close_btn').click(function(){
    var checkedIds = $(".chkIt:last:checked").map(function() {
                return this.value;    
    });
});
    console.log(checkedIds)

3 ( var checkedIds1 = $(".chkIt:last:checked").attr('value');

.HTML

<table id="" width="100%" border="0" cellspacing="0" cellpadding="0">
    <tbody><tr class="table_header">
    <tr class="product_row">
        <td class="small-check SerialNumber"><input class="chkIt" type="checkbox" name="products[product_id][]" value="85" product_weight="12"></td>
    </tr>
    <tr class="product_row">
        <td class="small-check SerialNumber"><input class="chkIt" type="checkbox" name="products[product_id][]" value="90" product_weight="22"></td>
    </tr>
</tbody>

Answer 1

你可以

用.last((和.val((得到它。

$(".chkIt:checked:last").attr('value')也将起作用。

$('#test').on('click', function() {
  console.log($(".chkIt:checked:last").attr("value"));
  console.log($(".chkIt:checked").last().val())
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="" width="100%" border="0" cellspacing="0" cellpadding="0">
    <tbody><tr class="table_header">
    <tr class="product_row">
        <td class="small-check SerialNumber"><input class="chkIt" type="checkbox" name="products[product_id][]" value="85" product_weight="12"></td>
    </tr>
    <tr class="product_row">
        <td class="small-check SerialNumber"><input class="chkIt" type="checkbox" name="products[product_id][]" value="90" product_weight="22"></td>
    </tr>
</tbody>
<button id="test">test</button>

Answer 2

可以通过以下代码获取值：

$(".chkIt:checked:last").val()

无需循环访问元素