Javascript 如何从$（此）中删除下一个元素？

我正在使用jQuery，发现了一些问题。我有一个按钮，单击时会添加一个

标签

和一个

span

。但是，当我试图通过逐个单击来删除标签时，带逗号的span不会被删除。我想删除单击标签后的跨距。这是我的剧本

$('#btn_add_vendor').on('click', function(){
    var added = "<label class='label label-primary lbl_test'>MY LABEL</label><span class='add_comma'>,</span>";

    $('#div_label').append(added); //the label appended here, in a div.

    $('.lbl_test').click(function () {
       $(this).remove();
       $(this).next(".add_comma").remove(); //not working

    });
});

$（'btn'u添加供应商'）。在（'click'，function（）上{
var added=“我的标签，”；
$（“#div_label”）.append（added）；//此处以div形式追加的标签。
$（'.lbl_test'）。单击（函数（）{
$（this.remove（）；
$（this）.next（“.add_逗号”）.remove（）；//不工作
});
});

如果先删除

$（此）

，则对

$（此）

的引用将不再存在。 尝试更改顺序并按如下方式执行：

$('.lbl_test').click(function () {
   $(this).next(".add_comma").remove();
   $(this).remove();
});

如果先删除

$（this）

，则对

$（this）

的引用将不再存在。 尝试更改顺序并按如下方式执行：

$('.lbl_test').click(function () {
   $(this).next(".add_comma").remove();
   $(this).remove();
});

---

它不起作用，因为当删除标签时，将找不到span作为其下一个元素。还可以使用单击文档方法，因为元素是动态附加的

请将您的代码更改为以下内容：

$('#btn_add_vendor').on('click', function(){
    var added = "<label class='label label-primary lbl_test'>MY LABEL</label><span class='add_comma'>,</span>";

    $('#div_label').append(added); //the label appended here, in a div.

    $(document).on("click",".lbl_test",function () {

       $(this).next(".add_comma").remove(); //REMOVE span FIRST
       $(this).remove();//THEN REMOVE label
    });
});

$（'btn'u添加供应商'）。在（'click'，function（）上{
var added=“我的标签，”；
$（“#div_label”）.append（added）；//此处以div形式追加的标签。
$（文档）.on（“单击”、“.lbl_测试”，函数（）{
$（this）.next（“.add_逗号”）.remove（）；//首先删除span
$（this）.remove（）；//然后删除标签
});
});

---

这将起作用。

它不起作用，因为当您删除标签时，将找不到span作为其下一个元素。还可以使用单击文档方法，因为元素是动态附加的

请将您的代码更改为以下内容：

$('#btn_add_vendor').on('click', function(){
    var added = "<label class='label label-primary lbl_test'>MY LABEL</label><span class='add_comma'>,</span>";

    $('#div_label').append(added); //the label appended here, in a div.

    $(document).on("click",".lbl_test",function () {

       $(this).next(".add_comma").remove(); //REMOVE span FIRST
       $(this).remove();//THEN REMOVE label
    });
});

$（'btn'u添加供应商'）。在（'click'，function（）上{
var added=“我的标签，”；
$（“#div_label”）.append（added）；//此处以div形式追加的标签。
$（文档）.on（“单击”、“.lbl_测试”，函数（）{
$（this）.next（“.add_逗号”）.remove（）；//首先删除span
$（this）.remove（）；//然后删除标签
});
});

---

这将起作用。

在删除

$（'.lbl\u test'）

之前删除span

$（'btn'u添加供应商'）。在（'click'，function（）上{
var added=“我的标签，”；
$（“#div_标签”）。追加（添加）；
$（'.lbl_test'）。单击（函数（）{
$（this）.next（“.add_逗号”）.remove（）；
$（this.remove（）；
});
});

在移除

$（'.lbl_test'）之前移除span

$（'btn'u添加供应商'）。在（'click'，function（）上{
var added=“我的标签，”；
$（“#div_标签”）。追加（添加）；
$（'.lbl_test'）。单击（函数（）{
$（this）.next（“.add_逗号”）.remove（）；
$（this.remove（）；
});
});

您是否尝试过先删除“.add逗号”及其所包含的元素？你能提供html吗？我想应该是

$（this）.nextUntil（'.add_逗号'）.next（）.remove（）$（this）.closest（“.add_逗号”）.remove（）@BarentBoden html已经是there@smit我的意思是html的其余部分，如果你运行它，它将不起作用，我的名字是BrentBodenh。你是否尝试过先删除“.add逗号”和它本身的元素？你能提供html吗？我想应该是
$（this）.nextUntil（'.add_逗号'）.next（）.remove（）$（this）.closest（“.add_逗号”）.remove（）@BarentBoden html已经是there@smit我的意思是html的其余部分，如果你运行它，它将无法工作，我的名字是BrentBodenI，只是评论了相同的内容，我在发布之前没有看到它。你为什么不把它贴出来作为答案呢？只是因为它有点小错误，但我把你的投了更高的票。谢谢。删除之前的span怎么样？谢谢@BrentBoden！我只是发表了相同的评论，在我发布之前，我没有看到它。你为什么不把它贴出来作为答案呢？只是因为它有点小错误，但我把你的投了更高的票。谢谢。删除之前的span怎么样？谢谢@BrentBoden！