2015-01-31 88 views
0

我不知道很多有关jQuery的呢,不过我用它来使这个导航菜单下拉的手机大小媒体查询点击菜单按钮时。我不断收到这个我找不出来的错误。jQuery的误差的移动导航栏

未捕获的ReferenceError:toggleMenu没有定义meetPractioner.html:53的onclick

我使用的脚本是这样的:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> 
    function toggleMenu() { 
     $('nav ul li a').slideToggle("fast"); 
    } 
    </script> 

虽然HTML是:

<nav> 
     <ul> 
      <li><a href="meetPractioner.html">Meet The Practioner</a></li> 
      <li><a href="servicesRates.html">Services &#38; Rates</a></li> 
      <li><a href="bookAppointment.html">Book Appointment</a></li> 
      <li><a href="locationHours.html">Location &#38; Hours</a></li> 
      <li><a href="testimonials.html">Testimonials</a></li> 
      <li><a href="questions.html">Questions &#38; Answers</a></li> 
      <li><a href="benefits.html">Benefits of Massage</a></li> 
      <li><a href="bodySense.html">Body Sense Magazine</a></li> 
     </ul> 
      <a onclick="toggleMenu()" class="menu-bttn">Menu</a> 
    </nav> 

我的jsfiddle是http://jsfiddle.net/Floyd/v723oqfc/1/

任何帮助是极大的赞赏。

回答

1

在你的小提琴,你没有定义toggleMenu。 但是尽量文档<head>在以下几点:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script> 
    function toggleMenu() { 
     $('nav ul li a').slideToggle("fast"); 
    } 
</script> 

这应该可以解决您的问题。

编辑

小提琴:http://jsfiddle.net/v723oqfc/2/(注意是 “不循环 - 在<head>” 的框架&扩展)

+0

谢谢!我没有把它放在我的小提琴中,抱歉使用它。然而,我确实有这个想法。它在你的小提琴中工作,但不在浏览器上。 – floyd 2015-01-31 18:55:37

+0

不同的是,你使用一个'script'标签和我使用两个。你需要把它们分开。如果'script'有一个'src'标签,打开和关闭标签之间的所有内容将被忽略。 – movabo 2015-01-31 18:59:26

+0

啊是啊!非常感谢你! – floyd 2015-01-31 19:04:24