使用 select2 时如何删除 Materialise 的 select 下拉菜单？

Question

我同时使用 MaterializeCSS 和 Select2，并且有一个正常的 :

<label>Seleção de PFJ</label>
<select id="manual-download-pfj-select" name="pfj-select" multiple></select>

然后：

$("#manual-download-pfj-select").select2({width: "100%"});

除了一个问题外一切正常：

我收到这个烦人的重复下拉菜单（这是 MaterializeCSS 的默认设置，但它没有搜索功能，所以我只想删除它）。 I've seen libraries 结合 MaterializeCSS 和 Select2，但它们没有用，因为它们只改变颜色/主题，保留无用的重复。两者之一，和搜索功能。

Answer 1

我已经设法通过直接删除 select-wrapper 的可见性来做到这一点：

.select-wrapper {
    display: none !important;
}

这远非理想，但似乎是唯一的方法。现在我可以使用那些 .css 改编使 Select2 看起来像 MaterializeCSS。

Answer 2

我会使用 browser-default class，它告诉框架跳过元素：

<div class="row">
  <label class="">Seleção de PFJ</label>
    <select class="browser-default" multiple>
      <option value="1">example 1</option>
      <option value="2">example 2</option>
      <option value="3">example 3</option>
    </select>
</div>

这将保留 Select2:

的搜索功能

使用 select2 时如何删除 Materialise 的 select 下拉菜单？

How can I remove Materialize's select dropdown when using select2?

javascript

jquery

html-select

materialize