占位符作为选项

Question

使用选择性创建下拉菜单时，选择一个选项后，选择占位符的唯一方法是单击输入字段＆amp;然后击中不太直观的退格。我们可以将占位符作为一个类似于本机选择元素的选项吗？

此github issue

中引用了类似的问题

Answer 1

我已为此问题编写了一个选择插件，该插件附加了占位符元素，点击后该元素将清除选择。

Selectize.define('selectable_placeholder', function( options ) {
    var self = this;

    options = $.extend({
        placeholder: self.settings.placeholder,
        html: function ( data ) {
            return (
                '<div class="selectize-dropdown-content placeholder-container">' +
                    '<div data-selectable class="option">' + data.placeholder + '</div>' +
                '</div>'
            );
        }
    }, options );

    // override the setup method to add an extra "click" handler
    self.setup = (function() {
        var original = self.setup;
        return function() {
            original.apply(this, arguments);
            self.$placeholder_container = $( options.html( options ) );
            self.$dropdown.prepend( self.$placeholder_container );
            self.$dropdown.on( 'click', '.placeholder-container', function () {
                self.setValue( '' );
                self.close();
                self.blur();
            });
        };
    })();

});

以下是gist

Working Fiddle

希望这有助于可能遇到此问题的人。