如果列表中不存在，则添加一个新值 "on the fly"

Question

我在页面上有一个 select 字段，用户应该能够添加 select 中不存在的新值。 select 使用具有默认搜索框功能的 select2 插件。

我觉得应该是这样的：

用户开始输入他们需要的值
如果他们找到了他们想要的东西 - 他们 select 它
如果没有 - 他们只是继续输入值到最后
然后使用新值提交表单。

如何实现？

Answer 1

对于版本 4：

查看 the documentation。您需要 tags: true 选项。如果您需要自定义函数来分配新的 id 和 text，它称为 createTags 并作为选项传入，例如：

$('#el').select2({
  tags: true,

  createTag: function(term) {
    return { id: ..., text: ... };
  }
});

release announcement 还描述了如何使用数据属性（在 "Declaring options using data-* attributes" 部分下）

<select data-data="[{id: '1', text: 'One', id: '2', text: 'Two'}]" data-tags="true"></select>

对于版本 3：

与版本 4（以上）几乎相同，但 createTags 以前称为 createSearchChoice。 version 3.x docs 非常好——我强烈建议您查看它们。请参阅 "Events" 部分下的示例，以及如何使用 "Documentation" 部分下的 createSearchChoice。

如果列表中不存在，则添加一个新值 "on the fly"

Add a new value "on the fly" if it doesn't exist in a list

javascript

jquery

jquery-select2