Question

我正在尝试自学JQuery和Javascript。我创建了一个购物清单webapp，它使用JQuery添加带有复选框输入的li项目到html。

下面是代码：

if(item.length < 1) {
        alert("Tell us what you need")
    } else {
        $("#list").append( "<li><input type='checkbox' value='None' id='checkbox' name='check' />" + 
            "<label for='checkbox'>" + item + "</label></li>");
        $("#input").val("");
        console.log("clear")
    };

我想要的是删除用户点击#clear按钮时检查的所有项目。我已经对此进行了研究，但一直无法提出仅删除已检查项目的解决方案。

我很感激任何帮助。

谢谢！

Answer 1

使用此

$(':checked').remove()

这将删除所有选中的复选框。

Answer 2

我认为你需要的是checked selector。要删除，您可以执行以下操作：

$("#checkbox:checked").parent("li").remove();

编辑：有人说你不应该有多个具有相同id的元素。将其更改为类并使用类似：

$(".checkbox:checked").parent("li").remove();

代替。如果所有复选框都是"li"的直接子项，那么li在技术上并不是必需的，并且可能效率较低，但根据您的网页可能不太可能破坏内容。

Answer 3

如果我理解你的任务，你需要删除列表中的每一个元素，如果他的输入子项在更改后没有被检查过吗？

$("#list").on('change', 'input[type=checkbox]', function() {
    if($(this).is(':checked')) {
        $(this).parent().remove();
    }
});

Answer 4

试试这个

$("[name=check]:checked").remove();

定位复选框并使用Jquery将其删除

4 个答案: