javascript - 如何删除来自选项标签的重复值

Question

我有一个带有多个选项的 Select 标记。单击按钮上的每个选定选项都会创建一个 li，其中将 innerText 设置为选项的文本值。我将如何制作一个我不能两次添加相同元素的函数？

 $(".btn").on("click", function () {
          let selectedItems = $("#node-input-options option:selected");
          selectedItems.each(function (i, el) {
            // console.log(el, i);
            let text = $(el).text();
            let val = $(el).val();
            var li = $("<li>").text(text).val(val).attr("title", val);
            list.append(li);
            li.on("dblclick", function () {
              li.remove();
            });
          });

这是我在 jquery 中的代码。这是小提琴上的示例=> https://jsfiddle.net/nah062ck/11/

标签： javascriptjquery

Answer 1

> 您可以使用 Jquery 包含选择器来检查列表中是否已存在所选项目。

    $("#b1").on("click", function() {
            var selectedItems = $("#cars option:selected");
            let list = $(".list");
            selectedItems.each(function(i,el) {
              var text = $(el).text();
              var val = $(el).val();
              var li = $("<li>").text(text).val(val).attr('title', val).attr("size",10);
              li.size = 10;
               var exists=$('.list li:contains('+text+')');
               if(exists.length > 0){
               alert('The Selected Word already exists');
                   return
               }
               list.append(li);
             
            });
          });