javascript - 如何在标签功能中禁用和重新启用“点击”及其功能？

Question

我编写了如下代码，以便在单击 时jquery使所选内容.fly li 出现在 tag_handler 中.fly li，它可以工作。

我的问题是如何在单击一次后禁用单击标记并在删除 tag_handler 中的标记后重新启用。谢谢。

function add_tag(that){
  var singleValues = $(that).html();
  $("#tag_handler").append(singleValues);
}

$(".fly li").click(function(){
    add_tag(this);
});

Answer 1

我做了一个小演示，可能满足您的两个要求 js：

$(function(){
    var tags = [];
    function add_tag(that){
      var tag = $(that).text();
      if($.inArray(tag, tags)>=0) return;
      tags.push(tag);
      var singleValues = $(that).html();
      $("#tag_handler").append(singleValues);
    }

    $(".fly li").click(function(){
        add_tag(this);

    });

    $('#tag_handler').on('click', 'span', function(){
        var tag = $(this).text();
        var index = $.inArray(tag, tags);
    tags.splice(index,1);
        $(this).remove();
    });
});

html:

<ul class="fly">
    <li><span>Tag 1</span></li>
    <li><span>Tag 2</span></li>
    <li><span>Tag 3</span></li>
    <li><span>Tag 4</span></li>
</ul>
Tags:
<div id="tag_handler"></div>

1. 点击“.fly li”将标签添加到“tag_handler”中；如果它已经被标记，什么也不做。
2. 点击“tag_handler”中的标签删除，然后可以重新添加；