js slideToggle不起作用

我是js的新手，所以這可能是一個初學者問題。js slideToggle不起作用

對於我的移動網站，我希望菜單在單擊頂部菜單圖標時與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露面。

任何人都可以幫我嗎？在此先感謝！ }）;

來源

2013-03-20 user2021743

是否包含jQuery庫？它看起來不像 – 2013-03-20 14:02:19

你忘了添加的jQuery（如傑夫·謝弗注意到）：在你的頭上加

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

加載jQuery庫。

此外，您忘記在代碼的末尾關閉$(document).ready(function(){和});（請參閱trajce答案）。

查看此fiddle作爲一個工作示例。

來源

2013-03-20 14:08:27 Bigood

謝謝！我添加了jQuery，但它仍然不起作用。當懸停並單擊圖像/類時，沒有任何反應。 Firebug只顯示我的js代碼，沒有錯誤..我不知道還有什麼問題.. – user2021743 2013-03-20 14:18:57

好吧，這很尷尬，我複製 - 粘貼錯了。我已經仔細檢查了$（documen）.ready（function（）{，但它仍然不起作用，在懸停或點擊圖像/類時沒有任何反應。 – user2021743 2013-03-20 14:26:38

@ user2021743隨着你寫的代碼，懸停不應該觸發'slideToggle（）'。另外，你的意思是「不工作」？是否觸發'click'事件？綁定是否正常？用螢火蟲JS調試器檢查斷點。 – Bigood 2013-03-20 14:47:02

假設<script src="script.js"></script>是jQuery庫，它看起來像你忘了關$(document).ready

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

來源

2013-03-20 14:14:23 trajce

js slideToggle不起作用

回答

相關問題