jQuery下拉菜单onclick
[英]Jquery dropdown menu onclick
问题描述
I am trying to make a simple dropdown menu with jquery but I cant seem to get any of the javascript to work. 
我正在尝试使用jquery制作一个简单的下拉菜单，但似乎无法使任何JavaScript正常工作。 I have tried calling it externally. 我尝试从外部调用它。 I am not sure what the problem can be, if you see a problem please let me know. 我不确定是什么问题，如果您发现问题，请告诉我。 Thanks. 谢谢。
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
#container{width:978px;}
.content {
display: none;
padding-left: 5px;
left: 0px;
width: 100%;
top: 30px;
background: yellow;
}
ul{width: 100%;}
li{
float: left;
padding: 5px;
background: #e5e5e5;}
#div{
background: #9e9e9e;
height: 20px;
width: 978px;
}
br{
clear: left;
}
</style>
<script type="text/javascript">
$(function() {
$('.action').click(function() {
var name = $(this).attr("name");
var content = $('.content[name=' + name + ']');
$('.content').not(content).hide('fast');
content.slideToggle('fast');
});
});
</script>
</head>
<body>
<div id="container"><ul>
<li>
<a href="#" class="action" name="summer">summer</a>
</li>
<li>
<a href="#" class="action" name="winter">winter</a>
</li>
<li>
<a href="#" class="action" name="weather">weather</a>
</li>
</ul></div><br>
<div class="content" name="summer">
<a href="link">june</a>
<a href="link">july</a>
</div>
<div class="content" name="winter">
<a href="link">november</a>
<a href="link">december</a>
</div>
<div class="content" name="weather">
<a href="link">rain</a>
<a href="link">sun</a>
</div>
<div id="div"></div>
</body>
</html>
4 个解决方案
解决方案1
1 2012-07-03 16:13:02
解决方案2
0 2012-07-03 16:11:20
Style and script tags should be inside your head tag. 样式和脚本标签应位于您的head标签内。 (though some people put all scripts just before the closing body tag) （尽管有些人将所有脚本放在结束body标签之前）
Without having a doctype weird things can happen. 没有doctype，可能会发生奇怪的事情。 add "<!doctype html>" before your opening html tag. 在打开html标记之前添加“ <！doctype html>”。
解决方案3
0 2012-07-03 16:26:18
Not sure why you've got a double forward slash in: 不确定为什么要在其中加双斜杠：
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
unless you mean something like: 除非您的意思是：
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
解决方案4
0 2015-01-03 18:25:36
I copied your code and there's an illegal character at line 42, after the second "});". 我复制了您的代码，在第二个“}）;”之后的第42行有一个非法字符。 I deleted this and it's working. 我删除了它，它正在工作。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.