html 链接点击一下显示下拉内容（再点击一下自动收回），上一次点击内容自动收回，代码怎么写？谢谢！
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Embedded & Satellite Meetings</title>
<link rel="stylesheet" type="text/css" href="css/iciam2015_Type1.css" />
<script language="javascript" type="text/javascript" src="js/default.js"></script>
<SCRIPT>
function isHidden(oDiv){
var vDiv = document.getElementById(oDiv);
vDiv.style.display = (vDiv.style.display == 'none')?'block':'none';
// add code
var allDiv = document.getElementsByTagName('div');
for (var i=0; i<allDiv.length; i++) {
if (vDiv != allDiv[i]) {
allDiv[i].style.display = 'none';
}
}
}
</SCRIPT>
<style type="text/css">
<!--
.STYLE2 {font-size: 15px; font-family: Arial, Helvetica, sans-serif; }
.STYLE6 {font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
.STYLE5 {font-size: 14px; font-family: Arial, Helvetica, sans-serif; }
.STYLE3 {font-family: Arial, Helvetica, sans-serif}
.STYLE4 {font-size: 14px}
-->
</style>
</head>
<body>
<div id="header">
<div class="roundedtop">
<map name="Map" id="Map">
<area shape="rect" coords="699,29,777,72" href="body1.jpg" target="_blank" />
<area shape="rect" coords="791,29,863,72" href="http://www.iciam.org/" target="_blank" />
</map>
</div>
</div>
<div id="main">
<div id="container" >
<div id="content">
<table width="95%" cellspacing="2" cellpadding="2" border="0"style="margin-left:20px;">
<tbody><tr><td colspan="2" height="15"align="left"class="STYLE6" >
<a href= "javascript:void(0)" style="cursor:hand" onclick="isHidden('div1')"><font color="#0072E3"><strong>1.READ MORE</strong>
</font></a>
<div id="div1" style="display:none" class="STYLE5" >
<strong>Chairman:</strong> <em>Shiqian Ma</em></br></div>
</td> </tr>
</tbody></table>
<table width="95%" cellspacing="2" cellpadding="2" border="0"style="margin-left:20px;">
<tbody><tr><td colspan="2" height="15"align="left"class="STYLE6" >
<a href= "javascript:void(0)" style="cursor:hand" onclick="isHidden('div1')"><font color="#0072E3"><strong>1.READ MORE</strong>
</font></a>
<div id="div1" style="display:none" class="STYLE5" >
<strong>Chairman:</strong> <em>Shiqian Ma</em></br></div>
</td> </tr>
</tbody></table>
</div>
</table>
</div>
</div>
</div>
</body>
</html> 展开
use different id for each div, and same name for all div that toggle
in js function, use getElementsByName
<script>
function isHidden(oDiv) {
...
var allDiv = document.getElementsByName('toggle');
...
}
</script>
<body>
...
<a href= "javascript:void(0)" style="cursor:hand" onclick="isHidden('div1')"><font color="#0072E3"><strong>1.READ MORE</strong>
</font></a>
<div id="div1" name="toggle" style="display:none" class="STYLE5" >
<strong>Chairman:</strong> <em>Shiqian Ma</em></br></div>
...
<a href= "javascript:void(0)" style="cursor:hand" onclick="isHidden('div2')"><font color="#0072E3"><strong>1.READ MORE</strong>
</font></a>
<div id="div2" name="toggle" style="display:none" class="STYLE5" >
<strong>Chairman:</strong> <em>Shiqian Ma</em></br></div>
...
</body>
