如何以编程方式隐藏选择选项？

我目前有一个选择性下拉列表，假设它有一些禁用和隐藏的选项，具体取决于我拥有的字符串列表。 这是我尝试的非选择性javascript函数：

    Volvo Saab Opel Audi Ford Hyundai Honda Porsche   All Vehicles Volvo Saab Opel Audi Ford Hyundai Honda Porsche   function ToggleSelectizeOptions(ids) { var selectizeOptions = document.getElementById("selectize").options; var selectizeSingleOption; //We always start at 1 because index 0 always have "" as the value. for (var idx = 1; idx < selectizeOptions.length; idx++) { selectizeSingleOption = selectizeOptions[idx]; if (ids) { if (ids.includes(selectizeSingleOption.value)) { selectizeSingleOption.style.display = ""; } else { selectizeSingleOption.style.display = "none"; } } else { selectizeSingleOption.style.display = ""; } } }    

这适用于没有选择控件的下拉菜单，但我正在寻找一个使用selectize.js来做同样事情的解决方案。

我看到这个问题与我想要的类似，除了答案在我想要隐藏选项时禁用该选项。

Answer 1

我不知道一种“隐藏”选择选项（使用显示css或其他方式）的方法，而不是简单地从初始化选择控件时创建的options数组中删除它们。 如果这就是您需要做的全部，那么您可以使用selectize removeOption(value)方法删除选择选项（请参阅下面的工作代码段中的示例）。

根据您的代码示例，您的最终目标似乎是创建级联下拉列表。 如果是这样，请参阅下面的第二个代码段以获取示例。

 const sel1 = $('#select1').selectize(); sel1[0].selectize.removeOption('ford'); sel1[0].selectize.refreshOptions(); 

           Ford Honda