Question

我正在使用所选的Koenpunt's fork，这允许我在配置对象中使用“create_option”选项。

它为用户提供了一种巧妙的方法，可以在选择框中找不到元素。

现在它的工作原理是让用户点击框中显示的“创建新事物”链接，但我希望它能自动创建这些新选项。这可能吗？我应该触发一个事件吗？

Answer 1

根据我的理解，

您正试图在SearchBox中输入选项时动态添加选项。
只有点击添加选项链接，Koenpunt的Chosen.jquery.js分叉才有此功能。

让我保持简单，通过关键事件触发添加选项链接（例如：输入密钥）会更好。经过多次尝试，我找到了来自chosen.js

Chosen.prototype.keydown_checker = function(evt){
...
...
}

在初始化jQuery和 Koenpunt的分叉 Chosen.js

<script type="text/javascript"> 
    Chosen.prototype.keydown_checker = function(evt) {
       if( event.which === 13)  {   
        $(this.form_field).append('<option>' + $(evt.target).val() + '</option>');
        $(this.form_field).trigger('liszt:updated');
        this.result_highlight = this.search_results.find('li.active-result').last();
        return this.result_select(evt);
       }
    }
</script>

我正在尝试创建一个JSFiddle，希望能得到它。

EDIT1：我在JSFIDDLE1

EDIT2 ：在尝试为onBlur()寻找方法时，我获得了以下opt方法

AbstractChosen.prototype.input_blur = function(evt){
...
...
}

上述代码几乎没有变化：

AbstractChosen.prototype.input_blur = function(evt) {
        $(this.form_field).append('<option>' + $(evt.target).val() + '</option>');
        $(this.form_field).trigger('liszt:updated');
        this.result_highlight = this.search_results.find('li.active-result').last();
        return this.result_select(evt);
    }

对应JSFiddle2希望你能找到两个小提琴的差异。

Answer 2

我建议您查看selectize.js，它具有您正在寻找的确切功能（即创建模糊选项）。

Select2也是另一种选择，它也具有您期望的相同标记功能（请参阅演示底部的“标记支持”部分）。

编辑：添加了Select2

如何在选定的插件中创建onblur的“创建选项”功能？

2 个答案: