简单易用的点击展开伸缩效果

<SCRIPT>
function openP(_id)
{
var select_id = parseInt(_id.replace("box",""));
for (i=1;i<=4;i++)
{
if (i==select_id)
{
document.getElementById("box"+i).style.display = "block";
}
else
{
document.getElementById("box"+i).style.display = "none";
}
}
}
</SCRIPT>

<a href="###" onmouseover="openP('box1')">1、点击展开1</a>
<p id="box1">
这里面放的是box1的内容.
</p>
<p><a href="###" onmouseover="openP('box2')">2、点击展开2</a></p>
<p id="box2" style="display:none">
这里面放的是box2的内容.
</p>
<a href="###" onmouseover="openP('box3')">3、点击展开3</a>
<p id="box3" style="display:none">
这里面放的是box3的内容.
</p>
<p><a href="###" onmouseover="openP('box4')">4、点击展开4</a></p>
<p id="box4" style="display:none">
这里面放的是box4的内容.
</p>
<br />
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码！</p>

function showlist (_id) {
//列表显示
var aMenu = document.getElementsByClassName("menu")[0], aDt = aMenu.getElementsByTagName("dt");
var len = aDt.length;
var select_id = parseInt(_id.replace("month", ""));
for (i = 1; i <= len; i++) {
if (i == select_id) {
document.getElementById("month" + i).style.display = "block";
}
else {
document.getElementById("month" + i).style.display = "none";
}
}
}

<dt onmouseover="showlist('month1')"><ul class="month"><li class="w288 textLeft">3月集合</li><li>2</li><li>0</li><li>0</li><li>0</li><li>0</li><li>0</li><li>0</li></ul></dt>