如何获取触发按钮的复选框的值，只有在jquery中

How to fetch the value of checkbox of the triggered button only in jquery?

本文关键字：复选框 jquery 按钮 何获取 获取      更新时间：2023-09-26
<tr>
    <td>Category 1</td>
    <td class="data">
        <ul>
            <li>
                <input name="items[]" type="checkbox" value="1"> Item 1
                <input name="items[]" type="checkbox" value="2"> Item 2
            </li>
        </ul>
    </td>
    <td>
        <button class="save">Save</button>
    </td>
</tr>
<tr>
    <td>Category 2</td>
    <td class="data">
        <ul>
            <li>
                <input name="items[]" type="checkbox" value="1"> Item 1
                <input name="items[]" type="checkbox" value="2"> Item 2
            </li>
        </ul>
    </td>
    <td>
        <button class="save">Save</button>
    </td>
</tr>

表是用jquery动态创建的。我想要的是，当我点击其中一个保存按钮时，我想从只包含被点击按钮的复选框中获取选中的数据，而不是从其他复选框中获取。

使用Jquery的每个函数来获取保存按钮对应的所有复选框，如下图

$(document).on("click", ".save", function () {
    $(this).closest("tr").find(".data [type=checkbox]:checked").each(function(){
    alert($(this).val());
});

})

试试这个，我使用这个代码来显示值，但你可以使用它来保存.... 

$(document).ready(function() {
    $("button").click(function(){
        var chkvalue = [];
        $.each($("input[name='items']:checked"), function(){            
            chkvalue.push($(this).val());
        });
        alert("My chkvalues are: " + chkvalue.join(", "));
    });
});

使用最近()

$(document).on("click", ".save", function () {
    $(this).closest("tr").find(".data [type=checkbox]:checked");
})

试试，

$(document).on("click",".save",function(){
  var checkedValues = $(this).closest("tr").find(".data :checked").map(function(){
    return this.value;
  }).get(); //["1","2"] depends on user selection
});

在文档的位置使用最接近.save的静态父按钮

演示

您必须设置checkid或checkclass复选框:

$('#checkid').val();
$('.checkclass').val();

或

$("input[type='checkbox']").val();

或

  $('#test').click(function() {
    alert("Checkbox state (method 1) = " + $('#test').prop('checked'));
    alert("Checkbox state (method 2) = " + $('#test').is(':checked'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Check me: <input id="test" type="checkbox" />

我想使用这个你可以找到你的复选框的值

$('.save').on('click',function(){    
   $(this).prev().find("input[type='checkbox']").prop('checked');
})

相关文章：