我的sideNav无法在使用materializeCSS的页面上工作
这是我的HTML：
html
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
<meta charset="UTF-8">
<title>Dutch Fork Running | Contact</title>
<!-- CSS -->
<link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="../includes/css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="../includes/css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="../includes/css/fullcalendar.css" rel="stylesheet" />
<link href="../includes/css/fullcalendar.print.css" rel="stylesheet" media="print" />
<link href="../includes/css/font-awesome.css" rel="stylesheet" />
<!-- Scripts -->
<script src="../includes/js/jquery.min.js"></script>
<script src="../includes/js/materialize.js" async defer></script>
<script src="../includes/js/moment.min.js"></script>
<script src="../includes/js/jquery.min.js"></script>
<script src="../includes/js/fullcalendar.js"></script>
<script src="../includes/js/ical.js"></script>
<script src="../includes/js/ical_events.js"></script>
<script src="../includes/js/ical_fullcalendar.js"></script>
<script src="../includes/js/gcal.js"></script>
<script src="../includes/js/init.js"></script>
<script type="text/javascript">var rootdir = "../";</script>
</head>
<body>
<!-- <div class="navbar-fixed"> -->
<header>
<nav class="green">
<div class="nav-wrapper">
<a href="../#" class="center brand-logo">
<img height="54px" src="../images/cc-arrow-green.png" alt="logo">
</a>
<a href="#" data-activates="mobile-menu" class="button-collapse" style="display:block !important;"><i class="material-icons">menu</i></a>
<ul class="side-nav" id="mobile-menu">
<li class="">
<a href="../">
Home
</a>
</li>
<li class="">
<a href="../Calendar">
Calendar
</a>
</li>
<li class="">
<a href="../Records">
Records
</a>
</li>
<li class="">
<a href="../Archives">
Archives
</a>
</li>
<li class="">
<a href="../Handbook">
Handbook
</a>
</li>
<li class="">
<a href="../Join">
Join
</a>
</li>
<li class="">
<a href="../Misc">
Misc Info
</a>
</li>
<li class="">
<a href="../Contact">
Contact
</a>
</li>
<li class="">
<a href="../BoosterClub">
Booster Club
</a>
</li>
<li class="">
<a href="../SFTR">
Silver Fox Trail Run
</a>
</li>
</ul>
</div>
</nav>
</header>
```
它说该页面上未定义sideNav函数。适用于其他对象，页面之间的粘贴部分没有区别。
这是回溯：
jQuery.Deferred exception: undefined is not a function (evaluating '$('.button-collapse').sideNav()') (2)
(anonymous function) — init.js:3
j — jquery.min.js:2:58607
(anonymous function) — jquery.min.js:2:88441
undefined
我用$（'。button-collapse'）。sideNav（）;来称呼它
解决：在实现javascript文件末尾调用
最佳答案
我通过添加$（'。button-collapse'）。sideNav（）;解决了此问题。到materialize.js文件的底部。
关于javascript - 实现CSS sidenav无法正常工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39089587/