js slideToggle不起作用

Question

我是js的新手，所以这可能是初学者的问题。

对于我的移动网站，我希望单击顶部的菜单图标时，菜单与slideToggle一起显示。

这是我的HTML：

<html>
<head>
<meta charset='utf-8'> 
<link rel="stylesheet" href="styles2.css">
<script src="script.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
<title>CSI - Home</title>
</head>
<body>

<a href="index.html"><img src="img/logo.png" alt="logo"/></a>
<div class="menu_icon"><img src="img/menu_icon.png" alt="menu_icon"/></div>

<div class="nav">
    <nav>
        <ul>
            <li><a href="home.html"><img src="img/home.png" alt="home"/>Home_</a></li>
            <li><a href="story.html"><img src="img/paper.png" alt="paper"/>Story_</a></li>
            <li><a href="course.html"><img src="img/glass.png" alt="glass"/>Course_</a></li>
            <li><a href="archive.html"><img src="img/archive.png" alt="archive"/>Archive_</a></li>
            <li><a href="facebook.html"><img src="img/facebook.png" alt="facebook"/>Discuss with Facebook_</a></li>
            <li><a href="twitter.html"><img src="img/twitter.png" alt="twitter"/>Discuss with Twitter_</a></li>
        </ul>
    </nav>
</div>

</body>
</html>

这是我的JavaScript：

$(document).ready(function(){   
    $(".menu_icon").on("click", function(){
        $('.nav').slideToggle();
    });

我希望.nav在单击.menu_icon类/图像时以slideToggle出现。

有人可以帮我吗？ 提前致谢！ }）;

Answer 1

您忘了添加jQuery（就像Jeff Shaver注意到的那样）：添加

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

在脑海中加载jQuery库。

而且，您忘记了关闭$(document).ready(function(){和}); 在代码末尾（请参见trajce答案）。

有关工作示例，请参见此小提琴。

Answer 2

假设<script src="script.js"></script>是jquery库，您好像忘了关闭$(document).ready

$(document).ready(function(){   
    $(".menu_icon").on("click", function(){
        $('.nav').slideToggle();
    });
});

js slideToggle不起作用

问题描述

2 个解决方案

解决方案1
0 2013-03-20 14:08:27

解决方案2
0 2013-03-20 14:14:23

js slideToggle不起作用

问题描述

2 个解决方案

解决方案1 0 2013-03-20 14:08:27

解决方案2 0 2013-03-20 14:14:23

解决方案1
0 2013-03-20 14:08:27

解决方案2
0 2013-03-20 14:14:23