如何用js做网页上的点击出现的二级菜单

JavaScript015

如何用js做网页上的点击出现的二级菜单,第1张

用jquery实现吧,其实网上 有不少这种小控件!

<div class="arrowlistmenu">

<h3 class="menuheader expandable">表单</h3>

<ul class="categoryitems">

<li><a href="1/">Horizontal CSS Menus</a></li>

<li><a href="2/">Vertical CSS Menus</a></li>

<li><a href="4/">Image CSS</a></li>

<li><a href="6/">Form CSS</a></li>

</ul>

<h3 class="menuheader expandable">菜单</h3>

<ul class="categoryitems">

<li><a href="">CSS Gallery</a></li>

<li><a href="">Menu Gallery</a></li>

<li><a href="">Web Design News</a></li>

<li><a href="">CSS Examples</a></li>

<li><a href="">CSS Compressor</a></li>

<li><a href="">CSS Forums</a></li>

</ul>

<h3 class="menuheader expandable">分页</h3>

<ul class="categoryitems">

<li><a href="#" >Free JavaScripts</a></li>

</ul>

</div>

不是点击事件 是键盘每输入一个字母触发一次(onkeyup触发事件)先设置一个隐藏框<div></div>(div的css样式display设为none)设置宽高 定好位置 每次触发更改div的display为块儿(block)

document.getElementById(“div的id”).style.display="block" 同时获取文本框值document.getElementById(“input的id”).value赋给一个变量 用ajax后台连接数据库显示出(echo)和你输入的字符匹配的数据 放到一个表格里 把返回的http.responseText写入到div框中document.getElementById(“div的id”).innerHTML=http.responseText

<select name="select" id=sel onchange="document.getElementById('p').innerHTML=this.options(selectedIndex).text">

<option value="0">请选择</option>

<option value="1">11</option>

<option value="2">22</option>

<option value="3">33</option>

</select>

<p id="p">显示内容 (比如选择1则出现1的内容 选择2出现2的内容) </p>