<html>
<head>
<script type="text/javascript">
var ListUtil ={};
ListUtil.remove = function(oListbox,iIndex)
{
oListbox.remove(iIndex);
};
ListUtil.clear = function(oListbox)
{
for(var i=oListbox.options.length-1;i>=0;i--)
{
ListUtil.remove(oListbox,i);
}
};
ListUtil.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);
}
</script>
<script type="text/javascript">
var TextUtil = {};
TextUtil.autoSuggestMatch = function(sText,arrValues)
{
var arrResult =[];
if(sText != "")
{
for(var i=0;i<arrValues.length;i++)
{
if(arrValues[i].indexOf(sText) ==0)
{
arrResult.push(arrValues[i]);
}
}
}
return arrResult;
};
TextUtil.autoSuggest = function(oTextbox,arrValues,sListboxId)
{
var oListbox = document.getElementById(sListboxId);
ListUtil.clear(oListbox);
var arrMatches = TextUtil.autoSuggestMatch(oTextbox.value,arrValues);
for(var i=0;i< arrMatches.length;i++)
{
ListUtil.add(oListbox,arrMatches[i]);
} ;
oListbox.style.visibility = "visible";
}
</script>
<script type="text/javascript">
var arrColors =["red","red1","yellow","gray","white"];
arrColors.sort();
function setText(oListbox,sTextboxId)
{
var oTextbox = document.getElementById(sTextboxId);
if (oListbox.selectedIndex >-1)
{
oTextbox.value =
oListbox.options[oListbox.selectedIndex].text;
};
oListbox.style.visibility = "hidden";
}
</script>
</head>
<body>
<p> Type in a color in lowercase:<br/>
<input type="text" value="" id="txtColor"
οnkeyup="TextUtil.autoSuggest(this,arrColors,'lstColors')"></input><br/>
<select id="lstColors" size="5" style="width:200px;visibility:hidden;"
onclick = "setText(this,'txtColor')"></select>
</p>
</body>
</html>
1022
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
