Question

我的原始选择框设置了required属性

<select name="some-name" value="initialValue" required>
     <option value="initialValue">initial value</option>
     <option value="otherValue">other value</option>
</select>

我开始选择：

$("select[name='some-name']").selectize()

但是，用户仍然可以使用退格键删除所选选项，使选择框的值为''。

由于真实选择框上的required似乎不会影响Selectize，我已阅读the selectize documentation但无法找到阻止用户删除该选项的任何方法。

如何阻止用户将值设置为除有效选项之外的任何内容？

Answer 1

使用Selectize no-delete工作正常。因为我使用npm：

var Selectize = require('selectize');

// https://github.com/akrikos/selectize-no-delete/blob/master/src/selectize-no-delete.js
Selectize.define('no-delete', function(options) {
  this.deleteSelection = function() {};
});

然后，当你制作一个选择实例时：

$("select[name='country-code']").selectize({
    plugins: {
        'no-delete': {}
    },
    ....
})

Answer 2

您可以检查删除选项时是否将所选选项小于1（如果已添加）。 getValue（）返回当前选定值的数组。

对于用户来说，它看起来就像是不可删除或不可移动的。

var userSelectize = $(...).selectize({});
userSelectize[0].selectize.on("item_remove", function(value, item) {
            if (userSelectize[0].selectize.getValue().length < 1) {
                this.addItem(value);
            }
    });

如何使selectize.js选择框需要一个值？

2 个答案: