幻灯片菜单 Javascript 不起作用答案

【问题标题】：Slide Menu Javascript not working幻灯片菜单 Javascript 不起作用
【发布时间】：2015-12-26 18:25:19
【问题描述】：

我一直在尝试使用 jQuery 创建滑动菜单，但在第 5 行和第 6 行出现错误 - 未定义函数。谁能看看我的代码有什么问题？

 // jQuery(document).ready(function($) {
jQuery(function($) {
 "use strict";
    $(document).ready(function () {
        $nav_list = $('#nav_list');
        $menuLeft = $('.pushmenu-left');


        $nav_list.click(function () {
            $(this).toggleClass('active');
            $('.pushmenu-push').toggleClass('pushmenu-push-toright');
            $menuLeft.toggleClass('pushmenu-open');
        });
    });
});

这是 HTML：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>DogHouse</title>


<script type="text/javascript" src="PushMenuJS.js"></script>

<link href="PushMenuCSS.css" rel="stylesheet" type="text/css">
</head>

<body class="pushmenu-push">
    <nav class="pushmenu pushmenu-left">
         <h3>Menu</h3>    
    </nav>
    <div class="container">
        <div class="main">
            <section class="buttonset">
                <div id="nav_list">Menu</div>
                <!-- End Content -->
        </div>
        <!-- End Main -->
    </div>
    <!-- End Container -->
        </body>
</html>

最后，这是 CSS

.pushmenu a {
    display: block;
}
.pushmenu-left {
    left: -240px;
}
.pushmenu-left.pushmenu-open {
    left: 0;
}
.pushmenu-push {
    overflow-x: hidden;
    position: relative;
    left: 0;
}
.pushmenu-push-toright {
    left: 240px;
}
 .pushmenu, .pushmenu-push {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
nav-list.active {
    background-position: -33px top;
}

抱歉，我知道我提供的太多了

谢谢

【问题讨论】：

有什么错误？
$nav_list 未定义 $menuLeft 未定义
给我们HTML代码，不仅仅是jQuery，我们可以帮助你
好吧，$nav_list 和 $menuLeft 实际上没有定义。您将它们视为在严格模式下不允许的隐式全局变量。

标签： javascript jquery css menu slide

【解决方案1】：

您正在使用严格模式。您不能仅通过为其赋值来创建全局变量。

您必须使用var 声明它。由于您的变量不需要全局范围，因此只需在现有行前面加上 var。

【讨论】：

我刚刚添加了那些已消除错误的前缀，但是单击时菜单仍然拒绝滑动
嗯，这是一个不同的问题，可能与您没有向我们展示的 CSS 有关。
您希望我提供 CSS 的哪一部分？为我缺乏知识道歉
应该导致你想要发生的效果的部分。 sscce.org