施用jquery作一个纵向菜单,超级链接为何失效?
使用jquery作一个纵向菜单,超级链接为何失效??HTML codehtml xmlnshttp://www.w3.org/1999/xhtmlhea
使用jquery作一个纵向菜单,超级链接为何失效??
HTML code<html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>无标题页</title> <script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("#menu li").toggle( function(){$(this).children("ul").slideDown(100)}, function(){$(this).children("ul").slideUp(100)} ); }); </script></head><body> <form id="form1" runat="server"> <div id="left"> <ul id="menu"> <li><a href="#">友情链接</a> <ul> <li><a href="http://www.baidu.com">百度</a></li> <li><a href="http://www.sina.com.cn">新浪</a></li> </ul> </li> </ul> </div> </form></body></html>
点击链接百度、新浪,没有任何反应。如果将toggle换成hover,则一切正常。
请问高手们,如果用toggle,该如何解决?
[解决办法]<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>无标题页</title>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#menu>li>a").toggle(
function(){$(this).next().slideDown(100)},
function(){$(this).next().slideUp(100)}
);
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="left">
<ul id="menu">
<li><a href="javascript:;">友情链接</a>
<ul>
<li><a href="http://www.baidu.com">百度</a></li>
<li><a href="http://www.sina.com.cn">新浪</a></li>
</ul>
</li>
</ul>
</div>
</form>
</body>
</html>