时间戳

首页 > 解决方案 > 如何关闭 selectize.js 选择列表中的选项列表？

javascript - 如何关闭 selectize.js 选择列表中的选项列表？

问题描述

我有一个 selected.js 多选列表，它是使用用户要从中选择的所有选项创建的。我使用以下命令以编程方式选择存储在数据库中的每个选项，但除了选择选项之外，还会显示选项列表：

// Create a variable that 'points' to the listSelect selelect list that
// has been converted to a selectize list.  The list already has all of the
// options in it.

$listSelectize = $( '#listSelect' );

// Clear all previously selected options ...

$listSelectize[ 0 ].selectize.clear( true ); // Clear previous selections.

// Select each list option that was saved in the database ...

// This is a test example ...

$listSelectize[ 0 ].selectize.addItem( 'option_one', true );

// The above command correctly select the option with the 'option_one' value,
// but it also causes the option list drop-down to be displayed.

// I've tried using the following commands to close the option list, but the
// drop-down list remains open.

$listSelectize[ 0 ].selectize.close();

// I've noticed that if after the form becomes interactive, that I can click
// it and the list closes, so the next few commands try to simulate this
// programmatically, but the list remains open, anyway.

$listSelectize[ 0 ].selectize.blur();  // Documentation says this should
                                       // force the focus away from the list.

$listSelectize[ 0 ].blur();            // This should do the same.

document.getElementById( 'firstInput' ).focus();

有没有办法在不打开选项下拉列表的情况下选择打开？

如果没有，我该如何关闭它，以便在表单可用时用户看不到它？

标签： javascriptselectize.js

解决方案

为 benvc 喝彩。您对 onItemAdd itemAdd 函数中的 refreshItmes() 和 refreshOptions() 方法调用的观察非常准确。正如我在上一条评论中指出的那样，我添加了一个交互式变量，并在我希望“静默”重置选择列表中的项目时将其设置为 false，然后在重置完成后将交互式设置为 true。然后我在 itemAdd 函数中添加了一个包含刷新调用和列表滚动的 if 语句，以便这些语句仅在 interactive 的值为 true 时执行。

再次感谢！

推荐阅读