var Textobj=new Object(); //创建与数组匹配的方法 Textobj.autosuggestMatch=function(sText,arrValues){ var arrResult=new Array; if(sText!=""){ for(var i=0;i<arrValues.length;i++){ if(arrValues[i].indexOf(sText)==0){ arrResult.push (arrValues[i]);//将颜数组色放入arrResule } } } return arrResult; };
//实现搜索,并将结果数组添加到列表框中 Textobj.autosuggest=function(oTextbox,arrValues,sListboxId){ //获取列表索引; var oListbox=document.getElementById(sListboxId); //将匹配的样色放入文本框内 var arrMatches=Textobj.autosuggestMatch(oTextbox.value,arrValues); //清空选项 Listobj.clear(oListbox);//清空 for(var i=0;i<arrMatches.length;i++){ Listobj.add(oListbox,arrMatches[i]); } };
//创建匹配数组 var arrColors=["测试","自动提示","沃尔沃","丰田","路虎","劳斯莱斯","悍马","大众","奇瑞QQ","吉利","玛莎拉蒂","夏利","捷达","宝马"]; arrColors.sort();//对数组进行排序,默认按 升序排列
//将列表框中的选项添加到文本框中 function setText(oListbox,sTextboxId){ var oTextbox=document.getElementById(sTextboxId); if(oListbox.selectedIndex>-1){ oTextbox.value=oListbox.options[oListbox.selectedIndex].text; } }
<head runat="server">
<title>自动提示文本</title>
<script language="javascript" type="text/javascript">
//添加选项
var Listobj=new Object();
Listobj.add=function(oListbox,sName,sValue){
var oOption=document.createElement("option");
oOption.appendChild(document.createTextNode(sName));
if(arguments.length==3){
oOption.setAttribute("value",sValue);
}
//添加选项
oListbox.appendChild(oOption);
}
//移动选项
Listobj.remove=function(oListbox,iIndex){
oListbox.remove(iIndex);
};
//清空选项
Listobj.clear=function (oListbox){
for(var i=oListbox.options.length-1;i>=0;i--){
Listobj.remove(oListbox,i);//移动选项
}
};
var Textobj=new Object();
//创建与数组匹配的方法
Textobj.autosuggestMatch=function(sText,arrValues){
var arrResult=new Array;
if(sText!=""){
for(var i=0;i<arrValues.length;i++){
if(arrValues[i].indexOf(sText)==0){
arrResult.push (arrValues[i]);//将颜数组色放入arrResule
}
}
}
return arrResult;
};
//实现搜索,并将结果数组添加到列表框中
Textobj.autosuggest=function(oTextbox,arrValues,sListboxId){
//获取列表索引;
var oListbox=document.getElementById(sListboxId);
//将匹配的样色放入文本框内
var arrMatches=Textobj.autosuggestMatch(oTextbox.value,arrValues);
//清空选项
Listobj.clear(oListbox);//清空
for(var i=0;i<arrMatches.length;i++){
Listobj.add(oListbox,arrMatches[i]);
}
};
//创建匹配数组
var arrColors=["测试","自动提示","沃尔沃","丰田","路虎","劳斯莱斯","悍马","大众","奇瑞QQ","吉利","玛莎拉蒂","夏利","捷达","宝马"];
arrColors.sort();//对数组进行排序,默认按 升序排列
//将列表框中的选项添加到文本框中
function setText(oListbox,sTextboxId){
var oTextbox=document.getElementById(sTextboxId);
if(oListbox.selectedIndex>-1){
oTextbox.value=oListbox.options[oListbox.selectedIndex].text;
}
}
</script>
</head>
<body>
<p>输入汽车名字:<br />
<input type="text" value="" id="txtColor" onkeyup="Textobj.autosuggest(this,arrColors,'lstColors')" /><br />
<select id="lstColors" size="5" style="width:200px;" onclick="setText(this,'txtColor')"></select></p>
</body>
</html>