首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

施用jquery作一个纵向菜单,超级链接为何失效?

2012-10-18 
使用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>

热点排行