你所说的div是叫我使用层了,那你是如何实现的可以告诉我吗?
我也做过,我是使用层把列表框放在层上,通过改变列表框的size属性来实现的。我实现的过程是当列表框得到焦点时size属性改为我需要的值,当失去焦点时我又把size的属性值改为1。不知道你时如何实现,还请多多指教。

解决方案 »

  1.   

    seabell(百合心)的意思是你根本就不要用Select了,完全用DIV做一个类似视觉效果的东东
      

  2.   

    谢谢了,但层在linux下的浏览器中的表现不是那么好啊!
      

  3.   

    <input name=hello ><select style=" position: absolute;" onfocus="this.size=this.length;theselectlength=this.length" onclick="this.size=1" onblur="if(theselectlength--<2)this.size=1">
    <option>fdsa1</option>
    <option>fdsa2</option>
    <option>fdsa3</option>
    <option>fdsa4</option>
    </select>
      

  4.   

    上面的程序有点错误 ,改成如下<input name=hello ><select style=" position: absolute;" onfocus="this.size=this.length;theselecterrornum=0" onclick="this.size=1" onblur="if(theselecterrornum++==3)this.size=1;">
    <option>fdsa1</option>
    <option>fdsa2</option>
    <option>fdsa3</option>
    <option>fdsa4</option>
    <option>fdsa5</option></select>
      

  5.   

    一个例子
    <script>
    function showdiv(w)
    {
    str="<table style='border:1 solid #000000;' width="+w+" cellspacing=0 cellpadding=0>";
    for(i=0;i<document.all.mysel.options.length;i++)
    str+="<tr><td style='font-size:10pt' onmouseover=myover() onmouseout=myout() onmousedown=myclick("+i+")>"+document.all.mysel.options[i].text+"</td></tr>";
    likesel.innerHTML=str+"</table>";
    likesel.style.display="block";
    }
    function myover()
    {
    event.srcElement.style.cursor="default";
    event.srcElement.style.color="white";
    event.srcElement.style.background="darkblue";
    }
    function myout()
    {
    event.srcElement.style.color="";
    event.srcElement.style.background="";
    }
    function myclick(j)
    {
    document.all.mysel.selectedIndex=j;
    likesel.style.display="none";
    }
    </script>
    <body>
    <select name=mysel onclick="likesel.style.display='none'" onfocus=showdiv(mysel.offsetWidth) onblur="document.all.likesel.style.display='none'">
    <option value=11>1111111
    <option value=12>111112
    <option value=13>1111111113
    </select><input><input>
    <div id=likesel><div>
      

  6.   

    百合心你能否给我看看我的代码是我按如下思路写的:
    使用层把列表框放在层上,通过改变列表框的size属性来实现的。我实现的过程是当列表框得到焦点时size属性改为我需要的值,当失去焦点时我又把size的属性值改为1。<html>
    <title>修改学生信息 </title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <SCRIPT LANGUAGE="JavaScript1.2">
    <!--
    var index=0;
    var selecttext;
    function linkobj(id)//得到焦点时改变size的值
    {
    var link_obj;
    var i;
    link_obj=document.getElementById(id);
    if(id=="text5")
    {
    link_obj.size=2;
    } if(id=="text8")
    {
    link_obj.size=5;
    }
        if(id=="text9")
    {
    link_obj.size=5;
    }
    if(id=="text14")
    {
    link_obj.size=5;
    }
    //index=formname.month.selectedIndex;
    //alert(index);
    //var types=event.srcElement.id;
    //alert("text_1");
    //linkobj.blur=linkobj2("text_8");
    }function linkobj2(id)//失去焦点时改变size的值
    {
    var link_obj;
    //var longOption;
    //var optionItm=new options(text,value,defaultSelected,selected);
    link_obj=document.getElementById(id);
    //document.formname.month.options[3];
    //alert(document.formname.month.options[3]);
    //link_obj.value=link_obj.options[link_obj.selectedindex];
    //index=link_obj.selectedindex;
    //longOption=link_obj.selectedindex;
    //alert(link_obj.value);
    //form.link_obj.options[4].selected=ture;
    index=link_obj.selectedIndex;
    //alert(index);
    link_obj.size=1;
    if(id="text5")
    {
    link_obj.selectedIndex=index;
    //alert(link_obj.Text);
    //alert(link_obj.value);
    //alert(document.formname.sex.options[index].text);
    //link_obj.size=1;
    }
    if(id="text8")
    {
    link_obj.selectedIndex=index;
    //alert(link_obj.value);
    //alert(document.formname.month.options[index].text);
    //link_obj.size=1;
    }
    if(id="text9")
    {
    link_obj.selectedIndex=index;
    //alert(link_obj.value);
    //alert(document.formname.day.options[index].text);
    //link_obj.size=1;
    }
    if(id="text14")
    {
    link_obj.selectedIndex=index;
    //alert(link_obj.value);
    //alert(document.formname.oneclass.options[index].text);
    //link_obj.size=1;
    }
    //index=formname.month.selectedIndex;
    //document.formname.month.options[index].selected="ture";
    //link_obj.value=link_obj.value;
    //link_obj.Option.index=3;
    //link_obj.Options[3].selected="ture";
    //alert(link_obj.Options[longOption].selected);
    }//-->
    </SCRIPT>
    </head>
      

  7.   

    接上面的代码:
    </head> <option value=F><font color="#ff0000">女</font></option>
         </select>
     </div>  <div id="Layer7" style="position:absolute; left:450px; top:31px; width:35px; height:13px; z-index:2; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" >
        <font color=#ff0000>***</font></div>
      <div id="Layer1" style="position:absolute; left:384px; top:82px; width:64px; height:20px; z-index:3; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" >
        <input maxlength=4 name="year" size="4" value="1985" id="text7">年
    </div>
         <div id="Layer2" style="position:absolute; left:447px; top:82px; width:65px; height:20px; z-index:4; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" > 
        <select name="month" id="text8"  onfocus="linkobj('text8')" onblur="linkobj2('text8')">
           <option value="1">1</option>
            <option value="2">2</option>
    <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
            <option value="11">11</option>
            <option value="12">12</option>
         </select>月
     </div>
                        <div id="Layer3" style="position:absolute; left:515px; top:83px; width:69px; height:20px; z-index:3; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000"  > 
        <select name="day" id="text9" onFocus="linkobj('text9')" onBlur="linkobj2('text9')">
          <option value="1"><font color="#ff0000">1</font></option>
          <option value="2" ><font color="#ff0000">2</font></option>
          <option value="3" ><font color="#ff0000">3</font></option>
          <option value="4" ><font color="#ff0000">4</font></option>
          <option value="5" ><font color="#ff0000">5</font></option>
          <option value="6" ><font color="#ff0000">6</font></option>
          <option value="7" ><font color="#ff0000">7</font></option>
          <option value="8" ><font color="#ff0000">8</font></option>
          <option value="9" ><font color="#ff0000">9</font></option>
          <option value="10" ><font color="#ff0000">10</font></option>
          <option value="11" ><font color="#ff0000">11</font></option>
          <option value="12" ><font color="#ff0000">12</font></option>
          <option value="13" ><font color="#ff0000">13</font></option>
          <option value="14" ><font color="#ff0000">14</font></option>
          <option value="15" ><font color="#ff0000">15</font></option>
          <option value="16" ><font color="#ff0000">16</font></option>
          <option value="17" ><font color="#ff0000">17</font></option>
          <option value="18" ><font color="#ff0000">18</font></option>
          <option value="19" ><font color="#ff0000">19</font></option>
          <option value="20" ><font color="#ff0000">20</font></option>
          <option value="21" ><font color="#ff0000">21</font></option>
          <option value="22" ><font color="#ff0000">22</font></option>
          <option value="23" ><font color="#ff0000">23</font></option>
          <option value="24" ><font color="#ff0000">24</font></option>
          <option value="25" ><font color="#ff0000">25</font></option>
          <option value="26" ><font color="#ff0000">26</font></option>
          <option value="27" ><font color="#ff0000">27</font></option>
          <option value="28" ><font color="#ff0000">28</font></option>
          <option value="29" ><font color="#ff0000">29</font></option>
          <option value="30" ><font color="#ff0000">30</font></option>
          <option value="31" ><font color="#ff0000">31</font></option>
        </select>
        日 </div>
      <div id="Layer4" style="position:absolute; left:581px; top:89px; width:35px; height:13px; z-index:3; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" >
        <font color=#ff0000>***</font> </div>  <div id="Layer8" style="position:absolute; left:383px; top:146px; width:35px; height:20px; z-index:2; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" > 
        <select name=oneclass id="text14" onFocus="linkobj('text14')" onBlur="linkobj2('text14')">
    <option value=1>初二(1)班</option>
    <option value=2>初二(2)班</option>
    <option value=3>初二(3)班</option>
    <option value=4>初二(4)班</option>
    <option value=5>初三(1)班</option>
    <option value=6>初三(2)班</option>
    <option value=7>初三(3)班</option>
    <option value=8>初三(4)班</option>
    <option value=11>培训(1)班</option>
    <option value=12>培训(2)班</option>
       </select>
    </div>
            <div id="Layer9" style="position:absolute; left:488px; top:151px; width:35px; height:13px; z-index:2; background-color: #cccc99; layer-background-color: #cccc99; border: 1px none #000000" > 
        <font color=#ff0000>***</font> </div>
      <table width="50%" border="1" height="188" align="center">
        <tr>
    <td width="21%" align="center">性别</td>
    <td width="79%">&nbsp;</td>
      </tr>
      <tr> 
    <td width="21%" align="center">出生日期</td>
    <td width="79%">&nbsp;</td>
      </tr>
      <tr>
    <td align="center">所属班级</td>
    <td>&nbsp;</td>
      </tr>
    </table>
    </form>
    </body>
    </html>
      

  8.   

    select的onblur事件很奇怪,就算是focus的时候也执行,不知为什么??
    哪位仁兄帮忙解释一下<input name=hello>请按tab键,这什么这里的值会变成3<br><select onfocus="this.size=this.length" onblur="hello.value=hello.value*1+1">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    </select><script>
    hello.focus()
    </script>