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

Question

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

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

据我所知，这个插件创建了一个带有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;
    },

我应该对此插件或任何其他插件执行哪些更改才能获得我希望在项目中拥有的内容？这个解决方案有其他替代方案吗？