添加到列表答案

【问题标题】：Adding to a list添加到列表
【发布时间】：2018-08-30 04:03:37
【问题描述】：

每当用户点击按钮时，我想使用 javascript 将文本输入中的任何内容添加到列表中。到目前为止，这是我的功能：

function add(){
    var form = document.getElementById('form')
    var email = form.elements.typer.value

    var select = document.getElementById('users')
    var option = document.createElement("option")
    option.text = email
    select.add(option)
}

它有效，但您可以多次添加相同的文本。如何制作程序，让用户不能多次添加相同的文字？

【问题讨论】：

添加前可以检查数组中是否已有文本。
查看sets
首先您必须检查选项中的值。如果 select 选项中存在，则必须忽略，否则可以添加值。
stackoverflow.com/a/646329/1675954（而不是警报，添加..）

标签： javascript html

【解决方案1】：

您可以使用一个数组来跟踪所有已添加的电子邮件。然后，在创建select的选项之前，检查是否在该数组中找到它，如果没有，则添加，如果是，则告诉用户。

见下面代码

var addedUsers = [];

function add(){
    var form = document.getElementById('form')
    var emailInput = form.elements.typer;
    let email = emailInput.value
    emailInput.value = "";

    if (addedUsers.indexOf(email) == -1){
      addedUsers.push(email)
      var select = document.getElementById('users');
      var option = document.createElement("option");
      option.text = email;
      select.add(option)
    } else {
      alert("This user is already in the list");
      emailInput.focus()
    }
}

<form id="form">
  <input id="typer"/>
  <button onclick="add()" type="button">Add</button>
</form>

<select id="users"></select>

【讨论】：

谢谢，但我也有一个删除按钮。你能把它考虑进去吗？
这是我的删除功能：
function rem(){ var form = document.getElementById('form') var email = form.elements.typer.value var select = document.getElementById('users') var options = select。 (var i = 2; i 的选项
拜托，这是另一个问题。关闭此问题，将我的答案标记为已接受，然后使用您在上面传递的信息打开一个新问题，然后在创建此新问题后单击新问题下方的 share 按钮并将链接传递给我。

【解决方案2】：

在添加文本之前，您可以使用includes() 检查它是否已经存在于列表中。 MDN：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

这将返回真或假，具体取决于该值是否已存在于列表中。

【讨论】：