求助，如何在输入框中弹出选择框？

如何实现类似于 http://www.ctrip.com/ 这个网页左上角那个“出发城市”的输入框功能？
最好能写出详细的代码，谢谢！

解决方案 »

  1.   

    他跳出的其实不是选择框，而是用JS控制的DIV层，当你选择DIV层中的某一项后，JS控制在文本框中显示这项，这个你多学学JS应该就能做出来。
      

  2.   

    可以说详细点吗？
    例如，如何实现在输入框的下方弹出那个div层，那个div层又如何编码，还有如何实现在输入框中输入拼音就能得到该拼音对应的中文结果？
      

  3.   

    给你个简单的示例吧，主要思路就是这样做的<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>示例</title>
    <link rel="StyleSheet" href="editor/base.css"><style type="text/css">
    <!--
    #div1 {
    position:absolute;
    background-color:#CCCCCC;
    width:200px;
    height:115px;
    display:none;
    z-index:1;
    left: 11px;
    top: 36px;
    }
    -->
    </style>
    </head>
    <body>
    <form name="form1" method="post" action="">
      <input type="text" name="txt" onFocus="showDiv()" id="txt">
      <div id="div1"><div onClick="setv(this);">上海</div><div onClick="setv(this);">北京</div></div>
    </form>
    <div id="editor_body"></div>
    </body>
    </html>
    <script>
    function showDiv() 
    {
    document.getElementById("div1").style.display = "block";
    }  
    function setv(obj) 
    {
    document.getElementById("txt").value = obj.innerText;
    document.getElementById("div1").style.display = "none";
    } 
    </script>
    至于实现在输入框中输入拼音就能得到该拼音对应的中文结果，这个是通过AJAX方法获得后端数据显示在前端的，这个说起来太复杂了，你可以查查资料
      

  4.   

    用JQuery的DIV实现
    网上太多了
      

  5.   

    AJAX与后端交互，根据你输入的内容返回相应的列表。然后再前端显示
      

  6.   

    首先说下,我看了下这个站点,不是用的ajax去查询提交的,获取结果的!但是楼上众位说的也不是不可以,我估计可能是开发的时候考虑到ajax的反应速度以及提交量的问题才没这么做
    再一个,这个站点应该是在加载的时候就已经把城市的数据给加载进来了!然后前台根据用户输入直接在数据里查找!
      

  7.   

    如果 你数据不是很复杂的话可以直接 用 jquery 超级select插件 v3.2.0.0版本http://blog.csdn.net/fkedwgwy/archive/2010/06/22/5687029.aspxjquery 超级select插件 v3.2.0.0版本