function puckerMenu(level) {
var levelLength = ('row' + level).length
var toDo = '0'
for (var iCount = 0 iCount <document.all.lengthiCount++){
if ( document.all[iCount].id.indexOf('row' + level) >-1 &&( document.all[iCount].id.length >levelLength)) {
if ( document.all('level' + level).src.indexOf('minus.gif') >-1 ) {
document.all[iCount].style.display = 'none'
toDo = '1'
} else {
document.all[iCount].style.display = 'block'
toDo = '0'
}
}
}
if ( toDo == '1' ) {
document.all('level' + level).src = 'images/plus.gif'
} else {
document.all('level' + level).src = 'images/minus.gif'
}
}
二、然后在网页上定义一个div和一个ul，注意div中要包含一个id为level开头的image和一个onclick事件，ul中id要包含row，默认情况下是展开的，如果需要默认为闭合，则要在ul中加入style="display:none"
例子如下：
<body>
<divstyle="CURSOR: hand"
onclick="puckerMenu('1')"><IMGid=level1
src="images/minus.gif">public class DataAccess</div>
<ulid=row1>
<li>private string connString
<divstyle="CURSOR: hand"
onclick="puckerMenu('2')"><IMGid=level2
src="images /plus.gif">protected DbConnection OpenConnection()</div>
<ulid=row2style="display:none">{...}</ul>
<li>
Other
</ul>
</body>
其实JS里面实现的各种鼠标点击，移动就显示什么什么东西的玩意全都是用两个办法实现的。一种是设置DIV层的高度，首先设置为0，鼠标移到特定的地方后，设置DIV层高度为正常高度。另一种是设置DIV层的可见属性为隐藏，.div1{displya:none}，这样就整个隐藏了（是绝对隐藏，网页上是不存在这个元素的。连地方都不用占。）然后鼠标移动到特地地方后设置DIV层可见，.div1{display:block}我只是告诉你方法，不管干什么，方法最重要，给你贴代码，是不负责任，因为那东西到哪都能找到。随便一个网页特效的网站上一大堆。知道方法后，自己实践一下，你会发现你学会了很多东西
/*** @author zhou2003737
* @date 2014/09/25 16:39
*/
<html doctype="html">
<head>
<title></title>
<script type="text/javascript">
window.onload = function(){
//获取文本框对象
var searchText = document.getElementById("searchText")
//获取提交button对象
var action = document.getElementById("action")
//获取要增加到的下拉列表对象
var selections = document.getElementById("selections")
//点击提交的时候执行的方法
action.onclick = function(){
//如果文本框对象中值不为空
if(searchText.value ){
//根据文本框中的值循环5次
for(var i =5i>0i--){
//设置下拉列表中的值的属性
var option = document.createElement("option")
option.value = searchText.value + i
option.text= searchText.value+i
//将option增加到下拉列表中。
selections.options.add(option)
}
}
}
}
//思路如上。你可以将点击时将文本框中值传到后台，后台返回数据后，在将数据存入下拉列表对象中。
</script>
</head>
<body>
<p><input type="text" placeholder="请输入查询对象" autofocus id="searchText"/></p>
<p><input type="button" id="action" value="提交"/></p>
<p><select id="selections">
</select></p>
</body>
</html>
