javascript - 如何删除之间的值标签？

Question

我正在使用JQuery以下方法创建复选框：

$('<input type="checkbox" ' + 'id=' + (i+1) + '>' + (i+1) + '</input><br/>')

然后，只要用户选中该框，它就会被删除：

if (this.checked) {
    $(this).remove();
}

但是，输入框被删除，但数字（id）保留在页面上，沿着 标签，所以我可以#i在 HTML 页面上看到那里。我也想删除它们。因此，为了使我的问题尽可能完整，这里是如何HTML放置的：

<input id="1" type="checkbox">
1
<br>

有人可以告诉我如何从页面中删除#i和删除吗？ 谢谢

score 3 · Accepted Answer

正如其他答案所述 - 输入没有结束标签

您仍然需要删除所有id和 。.next()您可以在 jquery中找到具有功能的那些。你应该把你的 id 放在<label>or中。然后。例如：

$(this).next('label').remove();
$(this).next('br').remove();
$(this).remove();

代码可以写得更短，但你可以看看它是如何工作的。

score 1 · Accepted Answer

那是因为input标签没有结束标签并remove忽略之后的所有内容>，请更改此：

$('<input type="checkbox" ' + 'id=' + (i+1) + '>' + (i+1) + '</input><br/>')

至：

$('<input type="checkbox" ' + 'id=' + (i+1) + 'value="' + (i+1) +'"><label>'+ (i+1) +'</label>')

$(this).next('label').andSelf().remove();

score 1 · Accepted Answer

<input>文本框中的文本不是用 textnode 设置的（比如 textareas），而是用value属性设置的。（对困惑感到抱歉）

然而，你想要一个复选框。最好，为它创建一个<label>，而不是一个文本节点加上一个 （jQuery 无法处理）：

<div class="inputcell">
    <input type="checkbox" id="check5">
    <label for="check5">5</label>
</div>

使用这个 DOM，您可以通过$("#check5").parent().remove(). 请注意，单个数字不是有效的元素 ID。

score 0 · Accepted Answer

输入标签没有结束标签，要创建一个复选框，您只需要以下内容：

$('<input type="checkbox" ' + 'id=' + (i+1) + '>');

如果您还想为该复选框使用标签，请创建适当的label或任何其他元素，因为您不能将 closign 标签用于输入并在它们之间放置文本

4 回答 4