HTML <选择>即使未选择，元素也会发送默认选择

Question

我通过 EJS 生成了一个下拉列表，它将默认selected 值设置为该公司当前的管理员值。

用户应该能够取消选择当前管理员并选择其他管理员，从而将当前管理员删除为公司管理员。

但是，选择另一个选项和/或按住 CTRL 键并单击默认选项不会取消选择它，并且表单会发送默认选项和任何其他可能选择的选项。

我是否错过了 selected 属性的工作方式中的某些内容？option

<div id="adminDropdown">

  <% if (companyAdmins) { %>

    <select name="chooseAdmins" id="chooseAdmins" form="updateCompany" multiple class="form-control">

      <% for (let location of currentCompany.locations ) { %>

        <% for (let contact of location.contacts) { %> 

          <option value="<%= contact.id %>" <%= contact.isCompanyAdmin ? 'selected' : '' %>><%= contact.firstName %> <%= contact.lastName %></option>

        <% } %>

      <% } %>

    </select>

    <span class="muted"><small>Hold `CTRL` to select multiple admins, or to deselect an admin.<br />

      To add users to this list, first add them to their Location's "Contacts".

    </small></span>

  <% } else { %>

    <div class="alert alert-warning">Error loading admins data</div>

  <% } %>

</div>

另外，检查 chrome 中的元素，“选定的”元素；属性在加载时正确显示，但在单击或 ctrl+单击选项后不会消失，就像它应该的那样。

Answer 1

我看到的问题是你没有关闭 select 内的第一个 for 循环<% for (let location of currentCompany.locations ) { %>&nbsp; &nbsp; <% for (let contact of location.contacts) { %>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <option value="<%= contact.id %>" <%= contact.isCompanyAdmin ? 'selected' : '' %>><%= `${contact.firstName} ${contact.lastName}` %></option>&nbsp; &nbsp; <% } %><% } %>顺便说一句，我认为在 ejs 中使用字符串文字只会降低代码的可读性。你可以保持简单<%= contact.firstName %> <%= contact.lastName %>

Answer 2

我想到了：问题是由于将&nbsp;chooseAdmins&nbsp;下拉列表中显示的代码复制到其下方的另一个类似下拉列表中而引起的，用户可以在其中选择新的默认位置，但我没有更新该位置name&nbsp;或&nbsp;id&nbsp;属性与新下拉列表的内容相关。所以实际上并没有出现错误，body-parser&nbsp;看到两个具有相同名称的&nbsp;select&nbsp;元素，因此它只是将两个元素的选定值合并到一个数组中.我学得越多，就越明白我理解的东西是多么的少。