metisMenu插件页面点击没反应

Question

有没有大佬遇到过使用metisMenu插件在页面点击没发生任何变化，相关的js都能初始化成功

页面代码

<div class="sidebar-collapse">
            <ul class="nav" id="side-menu">
                <li>
                    <div class="user-panel">
                        <a class="menuItem noactive" title="个人中心" href="">
                            <div class="hide" text="个人中心"></div>
                            <div class="pull-left image">
                                <img src="../static/img/img1.jpg" class="img-circle" alt="User Image">
                            </div>
                        </a>
                        <div class="pull-left info">
                            <p>[[${session.username}]]</p>
                            <a href="#"><i class="fa fa-circle text-success"></i> 在线</a>
                            <a href="" style="padding-left:5px;"><i class="fa fa-sign-out text-danger"></i> 注销</a>
                        </div>
                    </div>
                </li>
                <li>
                    <a class="menuItem" th:href="@{/system/main}"><i class="fa fa-home"></i> <span
                            class="nav-label">首页</span> </a>
                </li>
                <li th:each="menu:${menuList}">
                    <a th:class="${!#strings.isEmpty(menu.url) && menu.url != '#'} ? ${menu.target}" th:href="${#strings.isEmpty(menu.url)} ? '#' : ${menu.url}">
                        <i class="fa fa-bar-chart-o" th:class="${menu.icon}"></i>
                        <span class="nav-label" th:text="${menu.menu_name}"></span>
                        <span th:class="${#strings.isEmpty(menu.url) || menu.url == '#'} ? 'fa arrow'"></span>
                    </a>
                </li>
                
            </ul>
        </div>

js

$(function() {
    // MetsiMenu
    $('#side-menu').metisMenu();
}

jquery.metisMenu.js也已经初始化成功了，但是页面点击没有任何效果，<li>加不上class

Answer 1

你这个属于混编代码   应该是你编译完成之后再去执行初始化的事件