jquery - 在具体化选择框中隐藏选项

Question

物化文档 - http://materializecss.com/forms.html

我想通过 jquery 隐藏 Materialize 选择选项。我向选项添加了一个类，并通过使用此代码$('.break_5').hide();选项成功隐藏。但它显示在 Materialize 选择框中。

Answer 1

根据文档，为了更新选择中的项目，您必须销毁材料并重新运行初始化。

$('#mySelectID').material_select('destroy');

然后使用或不使用某些选项重新创建您的选择并初始化新选择。

$('#mySelectID option').hasClass('break_5').remove();
$('#mySelectID').material_select();

Answer 2

自这个答案以来，框架已经改变，所以我们开始：

let _select: M.FormSelect;
function InitSelect(): void {
  _select = M.FormSelect.init($('#your-select'))[0];
}

function RecreateSelectItems(userIsAdmin: boolean): void {
  _select.destroy();
  if (!userIsAdmin) {
    $('#your-select option.only-admin').remove();
  }

  InitSelect();
}

这是打字稿，但你明白了 :) 干杯。