实现可折叠，点击时不会扩展

Question

Materialize collapsible 在点击时不会展开。我已经正确初始化它，即使它不工作。这是我的 html 代码：

.
.

 <p style="color: #fff; font-family: 'Raleway',sans-serif; font-size: 62px; font-weight: 800; line-height: 72px; margin: 0 0 24px; text-align: center; text-transform: uppercase" id="demo"></p>
  <div class="row"></div>
    <ul class="collapsible popout col s6" id="clap">
    <li>
      <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
      <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
    </li>
    </ul>

  <div id="modal1" class="modal">
.
.
.

这是初始化代码

  <script>

  document.addEventListener('DOMContentLoaded', function() {
    checkCurrentUser();
    var elems = document.querySelectorAll('select');
    var instances = M.FormSelect.init(elems);
    var elemss = document.querySelectorAll('.collapsible');
    var instances = M.Collapsible.init(elemss, options);

  });
</script>

在此代码中，我也有 select 元素，但它工作正常。仅可折叠不起作用

Answer 1

取出未定义的options变量：

var instances = M.Collapsible.init(elemss);

控制台应该始终是出现任何问题的第一个地方，如果你在那里查看，你会看到 'options is undefined'。

文档有问题。

Answer 2

从 var instances = M.Collapsible.init(elemss, options); 中删除 options。在您的情况下，这是一个未定义的变量。根据文档，如果您要向组件添加额外的功能，您可以相应地添加一个对象，该对象将替换 options。所以简而言之，option 只是该对象的占位符。

实现可折叠，点击时不会扩展

materialize collapsible not expending on click

html

javascript

materialize