javascript - 尝试使用 materializecss 构建前端，但无法让可折叠元素工作

Question

我正在尝试构建一个前端，并且我想使用可折叠元素。问题是它什么也没做，我可以单击标题框但没有任何反应。

根据文档，如果动态添加元素，则必须“初始化”元素。

所以我在每次破坏和创建 Dom 元素的动作之后都这样做：

function setUpPageElements () {
    $.each($('.collapsible'), function (index,value) { 
        value.collapsible({
          accordion : true
        });
    })
};

这是我的 ERB 模板

<ul class="collapsible" data-collapsible"accordion">
        <% if jobs.first %>
            <% jobs.each do |job| %>
                <%= render partial: 'job', locals: {job: job} %>
            <% end %> 
        <% else %>
        <li >
            <section id="header" class="collapsible-header active" > <p id="name">No active jobs</p></section>
            <section  class="collapsible-body">
                There are currently no active jobs.
                You can create new jobs by creating selecting 'New Job from navigation bar along the top'
            </section>
        </li>
        <% end %>
</ul>

Answer 1

叹息

打开页面的初始请求，我没有调用元素初始化函数，以为我是；事实证明，我愚蠢地将函数调用放在手掌前额的错误位置，所以它没有被调用。