javascript - 删除某些内容时删除 span 标签

Question

我有一个 HTML 结构，我想删除一个附加项目。

<div class="tokenfield form-control">
    <input class="pro-credit-user" name="pro-credit-users[]" placeholder="Person or business name" style="position: absolute; left: -10000px;" tabindex="-1" type="text">
    <input style="position: absolute; left: -10000px;" tabindex="-1" type="text">
    <div class="token invalid">
        <span class="token-label" style="max-width: 152px;">dfgdfgdf</span>
        <a href="#" class="close" tabindex="-1">×</a>
    </div>
    <input class="token-input ui-autocomplete-input" autocomplete="off" placeholder="Person or business name" id="1479230390171168-tokenfield" tabindex="0" style="min-width: 60px; width: 1237.4px;" type="text">
</div>

<a class="delete-pro-credit" href="#">Delete</a>
<span class="pro-credit-error" style="color:red;float:right">Sorry, this user cannot be found. We will not be able to link this persons name with an Enjoius account</span>

我也有 jQuery 代码:

$("input.pro-credit-user").last().on('tokenfield:removetoken', function (e) {
    $(this).closest('span').remove(); // not working
})

当用户删除 token 时，我还想删除具有“pro-credit-error”类的范围。我已经编写了 jQuery，但它不起作用。

如何删除包含“pro-credit-error”类的范围？

Answer 1

closest 通过向上遍历 DOM 树中的祖先来工作。在这种情况下，您要删除的 span 不是它的祖先

虽然没有测试过，但你可以尝试一下

 $("input.pro-credit-user").last().on('tokenfield:removetoken', function (e) {
              $(this).parent().sibling('span.pro-credit-error').remove();
            })