请问如何实现像地址栏那样的下拉框呢？

http://webfx.eae.net/dhtml/combobox/combo_demo.htm
http://lucky.myrice.com/temp/select.htm

解决方案 »

  1.   

    看这个,还带有提示功能
    <html>
    <head>
    <title>动态列表框</title>
    </head>
    <!--by fason(2003-6-3)-->
    <body onload="init()">
    <select id="chgSelect" size="5" style="position: absolute; visibility: hidden;" onchange="setValue(this)">
    <option value="csdn">csdn
    <option value="msdn">msdn
    <option value="net_lover">net_lover
    <option value="meizz">meizz
    <option value="wsj">wsj
    <option value="emu">emu
        <option value="fason">fason</option>
        <option value="saucer">saucer</option>
        <option value="21cn">21cn</option>
        <option value="sohu">sohu</option>
    </select>
    <input onkeyup="editselect(this)" id="edit"><input type=button value="6" style="font-family:webdings;height:20;" id=d onclick="show()">
    <script>   
    var sv=new Array()
    var s,ev
    function init(){
    s=document.getElementById("chgSelect")
    ev=document.getElementById("edit")
    x=ev.offsetLeft;
    y=ev.offsetTop;
    objParent=ev.offsetParent;
    while(objParent.tagName.toUpperCase()!= "BODY"){
    x+=objParent.offsetLeft;
    y+=objParent.offsetTop;
    objParent = objParent.offsetParent;
    }
    y+=ev.offsetHeight
    s.style.pixelLeft=x
    s.style.pixelTop=y
    for(i=0;i<s.options.length;i++){
    sv.push(s.options[i].value)
    }
    }
    function setValue(o){
    ev.value=o.value
    o.style.visibility='hidden';
    ev.focus()
    }
    function editselect(obj){
    var sValue=obj.value
    var n=0
    var s=document.getElementById("chgSelect")
    if(sValue.replace(/\s/g,'').length==0){s.style.visibility='hidden';return}
    s.style.visibility=''
    s.options.length=0
    for(i=0;i<sv.length;i++){
    if(sv[i].indexOf(sValue)==0){
    s.add(new Option(sv[i],sv[i]))
    n++
    }
    }
    if(n==0){s.style.visibility='hidden';return}
    }
    function show(){
    s.length=0
    for(i=0;i<sv.length;i++){
    s.options.add(new Option(sv[i],sv[i]))
    }
    s.style.visibility=s.style.visibility==''?'hidden':''
    }
    function document.onclick(){
    if(event.srcElement!=d)s.style.visibility='hidden'
    }
    </script>
    </body>
    </html>
      

  2.   

    http://webfx.eae.net/dhtml/combobox/combo_demo.htm
    能够满足我的要求，便我要求数据是从数据库中取出的，应该如何去写呢
      

  3.   

    不错,还是有bug的,加数据就这样加
    <script>
    dm=new ComboBox("dm")
    dm.add(
           new ComboBoxItem("barge",1),
           new ComboBoxItem("benluc",2),
           new ComboBoxItem("benlieeeeck",3),
           new ComboBoxItem("taco",4)
           //循环写数据
          )
      

  4.   

    js里也可以套asp语句啊
    ...
    dm.add(
           new ComboBoxItem("barge",1),
           <%
           set rs=conn.execute("select * from tree")
           do while not rs.eof 
           i=1
           %>
           new ComboBoxItem("<%=rs("item")%>",<%=i%>),
           <%
            i=i+1
            rs.movenext
             loop
            %>
           //循环写数据....