怎么样定位呢？比如说点击一下文本筐后，出现的select菜单就紧挨在文本筐的下面

用<div>层来做,设置<div>中的style属性中的left,top等,如：
<div id="div1" style="position:absolute; width:186px; height:166px; z-index:5; visibility: hidden; top: 327px;"> 

解决方案 »

  1.   

    <html>
    <head>
    <script type="text/javascript">
    function go()
    {

    var temp=document.getElementById("colorselect"); var s=temp.options[temp.options.selectedIndex].text;

    var name=document.getElementById("d").tag;
    if(s!="----")
    {
    document.getElementById(name).value+=s;
    }
    }
    function set(name)
    {

    var layer=document.getElementById("d");
    layer.tag=name;
    var top=document.getElementById(name).offsetTop+20;
    var left=document.getElementById(name).offsetLeft;
    layer.style.top=top;
    layer.style.left=left;
    layer.style.visibility="visible";
    }
    function off()
    {
    document.getElementById('d').style.visibility='hidden';
    }
    </script>
    </head>
    <body>
    text1:  <input type=text width=20 id="txt1" onfocus="set(this.id)" onblur = "off()">
    <hr>
    text2:  <input type=text width=20 id="txt2" onfocus="set(this.id)" onblur = "off()">
    <hr>
    text3:  <input type=text width=20 id="txt3" onfocus="set(this.id)" onblur = "off()">
    <hr>
    <div id="d" style="visibility:hidden;background-color:red;position:absolute;width:10;height:10" tag="">
    <select id="colorselect" size=1 onchange="go()">
    <option selected>----</option>
    <option>red</option>
    <option>blue</option>
    <option>black</option>
    <option>green</option>
    </select>
    </div>
    </body>
    </html>
      

  2.   

    event.srcElement.offsetTop
    event.srcElement.offsetLeft
      

  3.   

    最好用div层来做，div里放入一些input来代替选项，先让div的不显示，单击文本筐后调整其位置，然后显示，选中div中的一个值后，此值设为所求文本筐的值，然后隐藏div
      <input id="myValue" type="text" name="comeHere" onclick="myDiv.top=(this.offsetTop+20);myDiv.left=this.offsetLeft;myDiv.style.display='block'"><div id="myDiv" style="display:none">
      <input type="text" value="111" onclick="myValue.value=this.value;myDiv.style.display='none'"><br>
      <input type="text" value="222" onclick="myValue.value=this.value;myDiv.style.display='none'"><br>
      <input type="text" value="333" onclick="myValue.value=this.value;myDiv.style.display='none'">
    </div>测试过了，样式你自己调整一下吧！
      

  4.   

    如果不用div直接用select也可以，你自己仿照div的试一下，差不多的。
      

  5.   

    定位不对啊 ！！
    大家帮我 看一下啊 ！！
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head>
    <body>
    <script language="JavaScript" type="text/JavaScript">
    function go(MYlayer,MYselect)
    {

        var text=document.getElementById(MYselect).value
    var name=document.getElementById(MYlayer).tag;
    //alert("go函数："+name)
        document.getElementById(name).value=text;
    document.getElementById(MYlayer).style.visibility='hidden';
    }
    function set(MYtext,MYlayer)
    {

    var layer=document.getElementById(MYlayer);
    layer.tag=MYtext;
        //alert("set函数"+layer.tag)
    var top=document.getElementById(MYtext).offsetTop+56;
    var left=document.getElementById(MYtext).offsetLeft+12;
    layer.style.top=top;
    layer.style.left=left;
    layer.style.visibility="visible";
    }
    </script>
      天天看到你
      <input name="work-part1" type="text" id="work-part1"  value="天天看到你" >
      <img src="../image/lookup1.gif" width="16" height="16" onClick=set("work-part1","Layer-work-part")><table width="894" height="415" border="2" cellspacing="0" bordercolor="#0000FF">
      <tr>
        <td width="443" align="center" valign="top">我想我开始恋爱了
          <input name="work-part" type="text" id="work-part"  value="天天看到你" >
          <img src="../image/lookup1.gif" width="16" height="16" onClick=set("work-part","Layer-work-part")> </td>

        <td width="439">&nbsp;</td>
      </tr>
      <tr>
        <td>  <div id="Layer-work-part" style="position: absolute; left:532px; top:162px; width:69px; height:78px; z-index:5; visibility: hidden;">
      <select name="select-work-part" class="input" onChange=go("Layer-work-part","select-work-part") id="select-work-part">
        <option value="教育/教学">教育/教学</option>
        <option value="管理">管理</option>
        <option value="采购">采购</option>
        <option value="品管">品管</option>
        <option value="市场开发">市场开发</option>
        <option value="方法发展">方法发展</option>
        <option value="销售/服务">销售/服务</option>
        <option value="程序/实验室">程序/实验室</option>
        <option value="过程控制">过程控制</option>
        <option value="学生">学生</option>
      </select>
    </div>&nbsp;</td>
        <td><input name="work-part3" type="text" id="work-part3"  value="天天看到你" >
          <img src="../image/lookup1.gif" width="16" height="16" onClick=set("work-part3","Layer-work-part")> </td>
      </tr>
    </table>
    </body>
    </html>
      

  6.   

    var t = e.offsetTop,  h = e.clientHeight, l = e.offsetLeft, p = e.type;
     while (e = e.offsetParent){t += e.offsetTop; l += e.offsetLeft;}
    e是文本框或者其它对象
    取出梅花雨日历，但感觉不太对似的，改后如下：
     var t = e.offsetTop,  h = e.clientHeight, l = e.offsetLeft, p = e.type;
     while (e.offsetParent){
       t += e.offsetTop; 
       l += e.offsetLeft;
       e=e.offsetParent;
    }
    最后t和l为所求
      

  7.   

    <input type=text style="width:100px;height:20px" onclick="document.getElementById
    ('woyingjie').style.visibility=''"><select style="position:relative;top:20px;left:-
    100px;width:100px;height:20px;visibility:hidden;" id="woyingjie">
    </select>