如何更改tail.select的值

Question

对不起我的英语：(

如何使用JS从tail.select(链接到GitHub(中选择值，我尝试更改select中的值，但没有帮助。

我想选择值：aaabs、aa和bfbb。

我看了文件，但搞不明白。

var items = [
{key: '11', value: 'aaabs', description: ""},
{key: '21', value: 'aa', description: ""},
{key: '31', value: 'bssss', description: ""},
{key: '41', value: 'bdsss', description: ""},
{key: '51', value: 'abbb', description: ""},
{key: '61', value: 'aaa', description: ""},
{key: '71', value: 'bvbb', description: ""}
];
tail.select("select", {
animate: true,
classNames: null,
csvOutput: false,
csvSeparator: ",",
descriptions: false,
deselect: false,
disabled: false,                // NEW IN 0.5.0height: 300,
width: 250,
hideDisabled: false,
hideSelected: false,
items: items,
locale: "en",                   // NEW IN 0.5.0
multiple: true,
multiLimit: Infinity,           // UPDATE IN 0.5.0
multiPinSelected: true,        // NEW IN 0.5.0
multiContainer: false,          // UPDATE IN 0.5.0
multiShowCount: true,
multiShowLimit: true,           // NEW IN 0.5.0
multiSelectAll: true,
multiSelectGroup: false,
openAbove: null,
placeholder: 'Select your choice...',
search: true,
searchFocus: true,
searchMarked: true,
sortItems: false,
sortGroups: false,
sourceBind: false,              // NEW IN 0.5.0
sourceHide: true,               // NEW IN 0.5.0
startOpen: true,
stayOpen: false,                // UPDATED IN 0.5.0
cbComplete: undefined,          // NEW IN 0.5.0
cbEmpty: undefined,             // NEW IN 0.5.0
cbLoopItem: undefined,
cbLoopGroup: undefined
});

function test() {
$(".tail-select-2").value = "aaabs, aa, bvbb"; //This code doesn't work.
}

<link href="https://cdn.jsdelivr.net/npm/tail.select@0.5.2/css/tail.select-default.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/tail.select@0.5.2/js/tail.select.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<select class="tail-select-2" multiple></select>
<button onclick="test()">Change values</button>

Answer 1

您可以使用handle函数来选择或取消选择选项亨德尔法

.handle(state, key, group, _force)此方法将更改传递选项的状态(第一个参数(。使用"；选择"如果选择"取消选择"启用"；或"；禁用"；作为第一参数；设置"；各自的状态。第四个自变量强制/跳过"；不要取消选择单选字段上的选项，这些字段是不可取消选择的"条件

var items = [
{key: '11', value: 'aaabs', description: ""},
{key: '21', value: 'aa', description: ""},
{key: '31', value: 'bssss', description: ""},
{key: '41', value: 'bdsss', description: ""},
{key: '51', value: 'abbb', description: ""},
{key: '61', value: 'aaa', description: ""},
{key: '71', value: 'bvbb', description: ""}
];

var select =tail.select("select", {
animate: true,
classNames: null,
csvOutput: false,
csvSeparator: ",",
descriptions: false,
deselect: false,
disabled: false,                // NEW IN 0.5.0height: 300,
width: 250,
hideDisabled: false,
hideSelected: false,
items: items,
locale: "en",                   // NEW IN 0.5.0
multiple: true,
multiLimit: Infinity,           // UPDATE IN 0.5.0
multiPinSelected: true,        // NEW IN 0.5.0
multiContainer: false,          // UPDATE IN 0.5.0
multiShowCount: true,
multiShowLimit: true,           // NEW IN 0.5.0
multiSelectAll: true,
multiSelectGroup: false,
openAbove: null,
placeholder: 'Select your choice...',
search: true,
searchFocus: true,
searchMarked: true,
sortItems: false,
sortGroups: false,
sourceBind: false,              // NEW IN 0.5.0
sourceHide: true,               // NEW IN 0.5.0
startOpen: true,
stayOpen: false,                // UPDATED IN 0.5.0
cbComplete: undefined,          // NEW IN 0.5.0
cbEmpty: undefined,             // NEW IN 0.5.0
cbLoopItem: undefined,
cbLoopGroup: undefined
});

function test() {
select.options.handle("select", 0 , "#") 
select.options.handle("select", 1 , "#") 
select.options.handle("select", 6 , "#") 
//take look
// console.log(select.options);
}

<link href="https://cdn.jsdelivr.net/npm/tail.select@0.5.2/css/tail.select-default.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/tail.select@0.5.2/js/tail.select.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<select class="tail-select-2" multiple></select>
<button onclick="test()">Change values</button>

Answer 2

我想注意tail.select库的更改。旧的存储库已经完全消失，新的版本在这里-

https://github.com/wolffe/tail.select.js

此外，演示在这里可用-

https://getbutterfly.com/tail-select/

由于该插件已经消失，几个月前，我将其更新到了0.5.20版本，ES6 0.6版本正在开发中。我正在全职维护这个插件/库。