jquery 显示隐藏切换
juqery 显示隐藏 <SCRIPT src="D:/jquery.min.js" type=text/javascript></SCRIPT> 我用的是1.4.3版本,跟换自己的js
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>视频</title> <SCRIPT src="D:/jquery.min.js" type=text/javascript></SCRIPT> <SCRIPT language="javascript"> $(document).ready(function() { $("h1").next("span").css("display","none"); $("h2").next("ul").css("display","none"); $("a").click(function(){ var filepath; filepath = $(this).parent().parent().prev().parent().prev().text(); if(filepath==""){return;} filepath = filepath +"/" + $(this).parent().parent().prev().text(); filepath = filepath +"/" + $(this).text(); showflashdiv(filepath); }); $("h1").click(function(){ //设置除了选中其它的h1下的span都隐藏 $(this).siblings().next("span").css("display","none"); var jspan = $(this).next("span"); if(jspan.css("display")=="none"){ jspan.css("display","block"); }else{ jspan.css("display","none"); } }); $("h2").click(function(){ var jul = $(this).next("ul"); if(jul.css("display")=="none"){ jul.css("display","block"); }else{ jul.css("display","none"); } }); }); </SCRIPT> <style> *,body,ul,li,h1,h2 { margin: 0; padding: 0; list-style: none; } body { font: 12px "宋体"; padding-top: 20px; } #menu { z-index:1; padding_left:200; width: 200px; margin: auto; } #menu h1 { cursor: pointer; color: #191970; font-size: 12px; padding: 5px 0 3px 10px; border: #C60 1px solid; margin-top: 1px; background-color: #E0FFFF; } #menu h2 { cursor: pointer; color: #777; font-size: 12px; padding: 5px 0 3px 10px; border: #E7E7E7 1px solid; border-top-color: #FFF; background-color: #F4F4F4; } #menu ul { padding-left: 15px; height: 100px; border: #E7E7E7 1px solid; border-top: none; overflow: auto; } #menu ul li { padding: 5px 0 3px 10px; }</style> </head> <body> <div id="menu"> <h1>2015</h1> <span> <h2 >1</h2> <ul> <li><a href="#" >01.wmv</a></li> <li><a href="#" >02.wmv</a></li> <li><a href="#" >03.wmv</a></li> <li><a href="#" >04.wmv</a></li> <li><a href="#" >05.wmv</a></li> </ul> <h2>2</h2> <ul> <li><a href="#" >00163.wmv</a></li> <li><a href="#" >00164.wmv</a></li> <li><a href="#" >00165.wmv</a></li> </ul> <h2>3</h2> <ul> <li><a href="#" >01.wmv</a></li> <li><a href="#" >02.wmv</a></li> </ul> <h2>4</h2> <ul> <li><a href="#" >01.wmv</a></li> <li><a href="#" >02.wmv</a></li> <li><a href="#" >03.wmv</a></li> </ul> <h2>5</h2> <ul> <li><a href="#" >01.wmv</a></li> <li><a href="#" >02.wmv</a></li> <li><a href="#" >03.wmv</a></li> <li><a href="#" >04.wmv</a></li> <li><a href="#" >05.wmv</a></li> <li><a href="#" >06.wmv</a></li> </ul> <h2>6</h2> <ul> <li><a href="#" >01.wmv</a></li> <li><a href="#" >02.wmv</a></li> <li><a href="#" >03.wmv</a></li> </ul> </span> <h1>2016</h1> <span> <h2 >1</h2> <ul> <li><a href="#" >00000.wmv</a></li> <li><a href="#" >00026.wmv</a></li> <li><a href="#" >00027.wmv</a></li> <li><a href="#" >00028.wmv</a></li> </ul> <h2 >2</h2> <ul> <li><a href="#" >00036.wmv</a></li> <li><a href="#">00037.wmv</a></li> <li><a href="#" >00038.wmv</a></li> </ul> </span> </div> </body> </html>