由访问者自行输入数据的下拉框

原创 2007年09月21日 11:17:00

下拉框可列出数据,然后还可以由用户自行输入,如何做到这一点?

具有edit功能的combobox    
 
<HTML>  
 <HEAD>  
 <PUBLIC>  
   <COMPONENT  TAGNAME="COMBOBOX">  
   <PROPERTY  NAME="Text"  GET="get_Text"  PUT="put_Text">  
   <PROPERTY  NAME="Width"  GET="get_Width"  PUT="put_Width">  
   <METHOD  NAME="SetFocus"  INTERNALNAME="htcFocus">  
   <METHOD  NAME="AddItems"  INTERNALNAME="htcAddItems">      
   <EVENT  NAME="onYYCenter"  ID="idEnter">  
   <EVENT  NAME="onYYCChoose"  ID="idChoose">  
   <ATTACH  EVENT="oncontentready"  ONEVENT="htcInit()">  
   </COMPONENT>  
 </PUBLIC>  
 <SCRIPT  LANGUAGE="javascript">  
   function  htcInit()  
   {  
 defaults.viewLink=document;  
 defaults.viewInheritStyle=false;  
 Body_Init();  
   }  
   function  htcAddItems(items)  
   {  
 var  i,len;  
 len=pCombo.options.length;  
 for(i=0;i<len;i++)  
 {pCombo.remove(0);}  
 for(i=0;i<items.length;i++)  
 {  
   var  o;  
   if((typeof  items[i])=='string')  
   {  
     if(!HasTheValue(items,i))  
     {  
       o=document.createElement('OPTION');  
       o.text=items[i];  
       pCombo.add(o);  
     }  
   }  
 }  
   }  
   function  htcFocus()  
   {  
     pText.focus();  
   }  
   function  get_Text()  
   {  
 return  pText.value;  
   }  
   function  put_Text(Value)  
   {  
 pText.value=Value;  
   }  
   function  get_Width()  
   {  
 return  pCombo.style.width;  
   }  
   function  put_Width(Value)  
   {  
 pCombo.style.width=Value;  
   }  
 </SCRIPT>  
 
 <SCRIPT  LANGUAGE="javascript">  
   function  Body_Init()  
   {  
 var  iRight=pCombo.clientWidth;  
 var  iBottom=pCombo.clientHeight;  
 var  iLeft=(pCombo.clientWidth-18);  
     pCombo.style.clip='rect(0,'+iRight+','+iBottom+','+iLeft+')';  
 pText.style.width=(pCombo.clientWidth);  
 pText.style.height=(pCombo.clientHeight);  
 pText.style.top=0;  
 pText.style.left=0;  
   }  
   function  Combo_Select()  
   {  
 pText.value=pCombo.options[pCombo.selectedIndex].text;  
   }  
   function  Text_ChkKey()  
   {  
     if(event.keyCode==13)  
         {  
   idEnter.fire();  
 }  
   }  
   function  HasTheValue(sitems,i)  
   {  
 var  ii;  
 for(ii=0;ii<i;ii++)  
 {  
   if(sitems[ii]==sitems[i])  
     return  true;  
 }  
 return  false;  
   }  
 </SCRIPT>  
 </HEAD>  
 <BODY>  
   <SELECT  STYLE="position:absolute;left:0;top:0;"  ONCHANGE="Combo_Select()"  NAME="pCombo">  
   </SELECT>  
   <INPUT  STYLE="position:absolute;left:0;top:0;z-index:4000"  onKeyPress="Text_ChkKey()"  TYPE="TEXT"  NAME="pText">  
   </BODY>  
</HTML>  
 

内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:由访问者自行输入数据的下拉框
举报原因:
原因补充:

(最多只允许输入30个字)