Select2中的可选optgroups

我想用缩进创建多级select2选项,但我不想为此使用optgroup元素,因为我想允许选择主要类别。 如果是select2,有什么方法可以设置样式吗?

我的原始HTML选择如下所示:

  Option 1 Suboption 1 Suboption 2 Suboption 3 Option 2 ...  $(".js-select-multiple").select2({maximumSelectionLength: 5}); 

所以不使用Select2我可以将text-indent属性添加到.l2类。 但是,似乎Select2不使用那些用于选项的类,因此设置这些类的样式将不起作用。

那有什么解决方法吗?

你是否正确认识到Select2没有将 class 标签中的CSS类带到结果列表中。 这主要与未将结果列表明确地绑定到现有标记以及还有一组合理的默认值有关。 之后添加转移类的能力比删除它更容易。

您可以通过覆盖templateResult并从data.element获取原始选项(其中data是第一个参数)来完成此操作。

 $('.select2').select2({ templateResult: function (data) { // We only really care if there is an element to pull classes from if (!data.element) { return data.text; } var $element = $(data.element); var $wrapper = $(''); $wrapper.addClass($element[0].className); $wrapper.text(data.text); return $wrapper; } }); 
 .l2 { padding-left: 1em; }