Question

<table>
    <tr><td>aaa</td><td><input type="checkbox" name="yes[]" value="aaa" checked /></td></tr>
    <tr><td>bbb</td><td><input type="checkbox" name="yes[]" value="bbb" /></td></tr>
    <tr><td>ccc</td><td><input type="checkbox" name="yes[]" value="ccc" checked /></td></tr>
</table>


<span id="delete">delete</span>

var val = $(input[checkbox]).val();
alert(val);

$('#delete').click(function(){
    //here should be delete all TR if input is not checked. how?
})

如何显示所有选中的值以及如果未检查此TR中的输入，如何删除所有TR？

现场例子：http://jsfiddle.net/RYrA4/1/

Answer 1

选择相应的元素，然后选择父tr，最后删除它们：http://jsfiddle.net/pimvdb/RYrA4/3/。

$('#delete').click(function(){
    $(":checkbox[name='yes[]']:not(:checked)") // select non-checked checkboxes
        .parent()  // <td>s (parents of checkboxes)
        .parent()  // <tr>s (parents of <td>s)
        .remove(); // remove <tr>s
})

Answer 2

超级简单的方法：

$('#delete').click(function(){
    $(":checkbox[name='yes[]']:not(:checked)").parents('tr').remove();
})

你可以做一个“每个”循环，如果你想获得更多，改变一些东西：）

Answer 3

jQuery的closest方法找到选择器定义的最近标记，从当前元素开始并向上推进树：

$('#delete').click(function(){
    $("input:checkbox[name='yes[]']:not(:checked)").closest('tr').remove();
})

Answer 4

您是否希望为每个选中的复选框显示提醒或一个提醒就足够了？对于个别警报：

$("#delete").click(function()
{
    var allCheckBoxes = $("input:checkbox[name='yes[]']"),
    selectedCheckBoxes = allCheckBoxes.filter(":checked"),
    unselectedCheckboxes = allCheckBoxes.not(":checked");
    unselectedCheckboxes.closest("tr").remove();
    selectedCheckBoxes.each(function()
                           {
                              alert(this.value);
                           });

}

对于单个警报，我们可以在“each”函数中创建一个逗号分隔的字符串，然后提醒它。

显示所有选中的值并删除TR

4 个答案: