Javascript 如何在一个元素中加入输入和选择？

例如，我知道select2 javascript插件，它允许使用方便的过滤器选项创建SelectElements：

在我的项目中，我希望有类似的功能，但我需要添加选定的选项，而不是过滤选项，如果没有一致性，则向集合添加新输入的（在输入字段中）项

据我所知，该插件使用HTML表单创建了一个容器：

createContainer: function () {
        var container = $(document.createElement("div")).attr({
            "class": "select2-container"
        }).html([
            "<a href='javascript:void(0)' class='select2-choice' tabindex='-1'>",
            "   <span class='select2-chosen'>&#160;</span><abbr class='select2-search-choice-close'></abbr>",
            "   <span class='select2-arrow' role='presentation'><b role='presentation'></b></span>",
            "</a>",
            "<label for='' class='select2-offscreen'></label>",
            "<input class='select2-focusser select2-offscreen' type='text' aria-haspopup='true' role='button' />",
            "<div class='select2-drop select2-display-none'>",
            "   <div class='select2-search'>",
            "       <label for='' class='select2-offscreen'></label>",
            "       <input type='text' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' class='select2-input' role='combobox' aria-expanded='true'",
            "       aria-autocomplete='list' />",
            "   </div>",
            "   <ul class='select2-results' role='listbox'>",
            "   </ul>",
            "</div>"].join(""));
        return container;
    },

createContainer:function（）{
var container=$（document.createElement（“div”））.attr({
“类”：“选择2个容器”
}).html([
"",
"",
"",
"",
"   ",
"       ",
"       ",
"   ",
“
”，
“
”，
“”].加入（“”）；
返回容器；
},

---

为了在我的项目中获得我想要的东西，我应该对这个插件或任何其他插件进行哪些更改？这个解决方案还有其他选择吗

不知道你想要什么。请更详细地解释预期的用户界面。听起来select2I中已经有了功能，我已经解决了这个问题。这就是我想要的：