(Javascript)Materializecss可折叠立即打开然后在点击时关闭

时间:2018-03-07 09:42:53

标签: javascript materialize

我正在尝试使用Materialisecss 100和Materialize JS创建一个可折叠的。当像这样创建我的可折叠并点击它时,它只是立即打开和关闭

 <ul class="collapsible" data-collapsible="accordion">
<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>
<li>
  <div class="collapsible-header"><i class="material-icons">place</i>Second</div>
  <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>
<li>
  <div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
  <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
</li>

将init放在Document上,就像这样:

    $(document).ready(function () {
$('.collapsible').collapsible({
});

});

你们有什么想法吗?谢谢!

2 个答案:

答案 0 :(得分:0)

来自文档:

  

可折叠元素只有在动态添加时才需要初始化

手风琴已在文件准备就绪时初始化。

删除以下内容应该有效:

$(document).ready(function(){
    $('.collapsible').collapsible();
});

答案 1 :(得分:0)

解决方案是我导入了Materialise JS两次,一次在我的布局中与我的所有页面共享,另一次在我的页面本身。