利用JS实现展开隐藏效果:
Code
1<html>
2<head>
3<title>JS实现展开隐藏</title>
4<script language="JavaScript" type="text/JavaScript">
5function showhidediv(id){
6 try{
7
8 var id1=document.getElementById(id);
9 id3.value="收缩";
10 if(id1)
11 {
12 if(id2.style.display=='block')
13 {
14 id2.style.display='none';
15 id3.value="展开";
16 }
17 else
18 {
19 id2.style.display='block';
20 }
21 }
22 }
23 catch(e){}
24 }
25</script>
26<body>
27<div id="id1">
28<!--
29<div onclick='showhidediv("id1");' style="color:red;">点击标题</div>-->
30<input type="button" value="展开" onclick='showhidediv("id1");' id="id3" style="background-color:white;">
31<div id="id2" style="display:none;">
32id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>
33id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>
34</div>
35</body>
36</head>
37</html>
38
1<html>
2<head>
3<title>JS实现展开隐藏</title>
4<script language="JavaScript" type="text/JavaScript">
5function showhidediv(id){
6 try{
7
8 var id1=document.getElementById(id);
9 id3.value="收缩";
10 if(id1)
11 {
12 if(id2.style.display=='block')
13 {
14 id2.style.display='none';
15 id3.value="展开";
16 }
17 else
18 {
19 id2.style.display='block';
20 }
21 }
22 }
23 catch(e){}
24 }
25</script>
26<body>
27<div id="id1">
28<!--
29<div onclick='showhidediv("id1");' style="color:red;">点击标题</div>-->
30<input type="button" value="展开" onclick='showhidediv("id1");' id="id3" style="background-color:white;">
31<div id="id2" style="display:none;">
32id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>
33id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>id2层的内容<br>
34</div>
35</body>
36</head>
37</html>
38