javascript - jQuery 单击删除

Question

我的代码将标签文本包含在跨度标记中，我想要做的是:当我单击每个跨度时删除跨度标记。

示例我添加了 test1 和 test2，因此在精炼者:中，如果我单击每个标签 test1，则删除该标签 test1，或者如果我单击 test2，则删除标签 test2。

有人可以帮助我，我不明白我做错了什么。

var increment2 = 1;
$('input[type=checkbox]').on('click', function() {
  var $li = $(this).parent('li').get(0);
  if ($(this).is(':checked')) {
    $('#selected_items').append('<span class="label label-primary" selected-item="' + $li.id + '_selected">' + $($li).find('label').text() + '</span>');
  } else {
    $('#selected_items > span[selected-item^="' + $li.id + '"]').remove();
  }
  $("span").bind("click", function() {
    alert("The quick brown fox jumps over the lazy dog.");
    $(span).remove();
  });
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<ul class="sidebar-nav">
  <li style="text-indent: 0px;">
    <a id="selected_items">Refined by:</a>
  </li>
  <div class="collapse-link">
    <a aria-controls="collapseCommittee" aria-expanded="false" class="collapsed" data-target="#collapseCommittee" data-toggle="collapse">click bellow to include</a>
  </div>
  <ul class="bill-type">
    <li id="item1">
      <input type="checkbox" />
      <label for="">test1</label>
      <span for="" class="pull-right">222</span>
    </li>
    <li id="item2">
      <input type="checkbox" />
      <label for="">test2</label>
      <span for="" class="pull-right">33</span>
    </li>
  </ul>

Answer 1

你可以这样做:

$('#selected_items').on('click', '.label-primary', function(){
    $(this).remove();
});