jquery 一个显示二级导航栏有关问题

2012-09-14

jquery 一个显示二级导航栏问题JScript code!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional/

jquery 一个显示二级导航栏问题

JScript code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head>  <title>test </title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <script src="js/jquery-1.7.js"></script>  <script type="text/javascript">$(".clicko").click(function(){$(this).parent().find('.test>li').show();}) </script>  <style type="text/css">.listimages{list-style-type:none;font-size:16px;float:left;margin:0;}.list1{list-style-type:none;background:url(images/2.jpg) no-repeat top center;padding:10px 0 0 0px;margin:0;display:none;}.test li{display:none;}.sp{float:left;display:inline;width:14px;font-size:14px;word-wrap:break-word;word-break:nomal;margin:0 10px 0 0;}</style></head><body><ul><li class="listimages"><div style="width:1em;float:left;font-weight:bold;cursor:pointer" class="clicko">流逝岁月</div><ul class="test"><li class="list1 sp"><a href="#">作风友情</a></li><li class="list1 sp"><a href="#">告诉你啊</a></li></ul></li><li class="listimages"><div style="width:1em;float:left;font-weight:bold;cursor:pointer" class="clicko">学不思路</div><ul class="test"><li class="list1 sp">奇峰异次</li><li class="list1 sp">劳技课从</li></ul></li><li class="listimages"><div style="width:1em;float:left;font-weight:bold;cursor:pointer" class="clicko">走路风情</div><ul class="test"><li class="list1 sp">奇峰异次</li><li class="list1 sp">劳技课从</li></ul></li><li class="listimages"><div style="width:1em;float:left;font-weight:bold;cursor:pointer" class="clicko">四期符合</div><ul class="test"><li class="list1 sp">奇峰异次</li><li class="list1 sp">劳技课从</li></ul></li></ul></body></html>

触发类clicko的click事件，显示当前的兄弟节点的内容。比如点击"四期符合"，然后显示出下面的

CSS code

<ul class="test"><li class="list1 sp">奇峰异次</li><li class="list1 sp">劳技课从</li></ul>

有人帮忙看看，为什么这样写出不来呢？谢谢！

[解决办法]

CSS code

.list1{list-style-type:none;background:url(images/2.jpg) no-repeat top center;padding:10px 0 0 0px;margin:0;display:none;}.test li{display:none;}
[解决办法]
你写少了加载函数$(function{})或$(document).ready(){}
$(function(){
$(".clicko").click(function(){
$(this).parent().find('.test>li').show();
});
});
[解决办法]
JScript code    $(document).ready(function(){        $(".clicko").toggle(function(){            $(".test>li").hide();            $(this).parent().find('.test>li').show();        },function(){            $(".test>li").hide();        })    });

热点排行

JavaScript

jquery 一个显示二级导航栏有关问题