更多功能自己添加
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<Script Language="JavaScript">
<!--
function selectStation() {
var objSelStation = document.all.selStation;
if (objSelStation.selectedIndex != -1) {
var stationName = objSelStation.options[objSelStation.selectedIndex].text;
whichText.value = stationName;
}
}
var t=0,t1
function similarFind(txtObj) {//匹配用text中的数据跟下拉框中的数据
if(event.keyCode==40)
{
txtObj.value=document.SearchForm.selStation.options[t].text
t++
if(t==document.SearchForm.selStation.options.length) t=0
}
if(event.keyCode==38)
{
txtObj.value=document.SearchForm.selStation.options[t1].text
t1--
if(t1<0) t1=document.SearchForm.selStation.options.length-1
}
}
function showDivStation(obj, b) {//下拉框显示位置
var divStation = document.all.divSelStation;
if (b) {
whichText = obj;
divStation.style.top = 20;
divStation.style.left = 0;
divStation.style.display="block";
similarFind(obj);
} else {
divStation.style.display="none";
}
} function clearSearchForm() {
document.SearchForm.startStation.value = "";
document.SearchForm.endStation.value = "";
}
var whichText;
//-->
</Script><BODY bgcolor="#FFFFFF" topmargin="0" leftmargin="0" onload="t1=document.SearchForm.selStation.options.length-1">
<form name="SearchForm" >
<input type="hidden" name="cityCode" value="0075">
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 width="100%" bgcolor="#FFFFFF" height="650" align="center">
<TR>
<TD colspan="2" rowspan="2" valign="top" bgcolor="#FFFFFF" class="box">
<input type="text" size="20" name="stationname" style="width:120" onfocus="showDivStation(this, true)" onblur="showDivStation(this, false)" onkeydown="similarFind(this)">
</TD>
</TR>
</TABLE>
<div id="divSelStation" style="position:absolute; width:120px; top:200px; left:60px; display:none; background-color:black">
<table width="100%" valign="top" cellspacing="0" cellpadding="0" border="0">
<tr align="center">
<td><select name="selStation" size="10" style="width:120; top:200px; left:60px; background-color:#CCCC99" onclick="selectStation()" onkeyup="selectStation()">
<option value="1" >刘备</option>
<option value="2" >关羽</option>
<option value="3" >张飞</option>
<option value="4" >马超</option>
<option value="5" >黄忠</option>
<option value="6" >赵云</option>
<option value="7" >诸葛亮</option>
</select></td>
</tr>
</table>
</div>
</form>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<Script Language="JavaScript">
<!--
function selectStation() {
var objSelStation = document.all.selStation;
if (objSelStation.selectedIndex != -1) {
var stationName = objSelStation.options[objSelStation.selectedIndex].text;
whichText.value = stationName;
}
}
var t=0,t1
function similarFind(txtObj) {//匹配用text中的数据跟下拉框中的数据
if(event.keyCode==40)
{
txtObj.value=document.SearchForm.selStation.options[t].text
t++
if(t==document.SearchForm.selStation.options.length) t=0
}
if(event.keyCode==38)
{
txtObj.value=document.SearchForm.selStation.options[t1].text
t1--
if(t1<0) t1=document.SearchForm.selStation.options.length-1
}
}
function showDivStation(obj, b) {//下拉框显示位置
var divStation = document.all.divSelStation;
if (b) {
whichText = obj;
divStation.style.top = 20;
divStation.style.left = 0;
divStation.style.display="block";
similarFind(obj);
} else {
divStation.style.display="none";
}
} function clearSearchForm() {
document.SearchForm.startStation.value = "";
document.SearchForm.endStation.value = "";
}
var whichText;
//-->
</Script><BODY bgcolor="#FFFFFF" topmargin="0" leftmargin="0" onload="t1=document.SearchForm.selStation.options.length-1">
<form name="SearchForm" >
<input type="hidden" name="cityCode" value="0075">
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 width="100%" bgcolor="#FFFFFF" height="650" align="center">
<TR>
<TD colspan="2" rowspan="2" valign="top" bgcolor="#FFFFFF" class="box">
<input type="text" size="20" name="stationname" style="width:120" onfocus="showDivStation(this, true)" onblur="showDivStation(this, false)" onkeydown="similarFind(this)">
</TD>
</TR>
</TABLE>
<div id="divSelStation" style="position:absolute; width:120px; top:200px; left:60px; display:none; background-color:black">
<table width="100%" valign="top" cellspacing="0" cellpadding="0" border="0">
<tr align="center">
<td><select name="selStation" size="10" style="width:120; top:200px; left:60px; background-color:#CCCC99" onclick="selectStation()" onkeyup="selectStation()">
<option value="1" >刘备</option>
<option value="2" >关羽</option>
<option value="3" >张飞</option>
<option value="4" >马超</option>
<option value="5" >黄忠</option>
<option value="6" >赵云</option>
<option value="7" >诸葛亮</option>
</select></td>
</tr>
</table>
</div>
</form>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<Script Language="JavaScript">
<!--
function selectStation() {
var objSelStation = document.all.selStation;
if (objSelStation.selectedIndex != -1) {
var stationName = objSelStation.options[objSelStation.selectedIndex].text;
whichText.value = stationName;
}
}
//响应text的事件
var pageD =0, pageU;
function similarFind(txtObj) {
var curStationName = txtObj.value;
var objSelStation = document.all.selStation;
var stationLength = objSelStation.options.length;
pageU = pageD;
//匹配用text中的数据跟下拉框中的数据
for (var i=0; i<stationLength; i++) {
var stationName = objSelStation.options[i].text;
var re = new RegExp("^" + curStationName);
if (stationName.match(re)) {
if (i<stationLength - 10) {
objSelStation.selectedIndex = i + 10;
}
objSelStation.selectedIndex = i;
pageD = i;
pageU = i;
break;
}
}
//响应下移键
if(event.keyCode==40) {
pageD++;
if(pageD==document.browser.selStation.options.length) pageD=0;
txtObj.value=document.browser.selStation.options[pageD].text ;
objSelStation.selectedIndex = pageD;
}
//响应上移键
if(event.keyCode==38) {
--pageU;
if(pageU<0) pageU=document.browser.selStation.options.length-1;
objSelStation.selectedIndex = pageU;
txtObj.value = document.browser.selStation.options[pageU].text;
}
}
function showDivStation(obj, b) {//下拉框显示位置
var divStation = document.all.divSelStation;
if (b) {
whichText = obj;
divStation.style.top = 20;
divStation.style.left = 0;
divStation.style.display="block";
similarFind(obj);
} else {
divStation.style.display="none";
}
} function clearSearchForm() {
document.browser.startStation.value = "";
document.browser.endStation.value = "";
}
var whichText;
//-->
</Script><BODY bgcolor="#FFFFFF" topmargin="0" leftmargin="0">
<form name="browser" >
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 width="100%" bgcolor="#FFFFFF" height="650" align="center">
<TR>
<TD colspan="2" rowspan="2" valign="top" bgcolor="#FFFFFF" class="box">
<input type="text" size="20" name="stationname" style="width:120" onfocus="showDivStation(this, true)" onblur="showDivStation(this, false)" onkeyup="similarFind(this)">
</TD>
</TR>
</TABLE>
<div id="divSelStation" style="position:absolute; width:120px; top:200px; left:60px; display:none; background-color:black">
<table width="100%" valign="top" cellspacing="0" cellpadding="0" border="0">
<tr align="center">
<td><select name="selStation" size="10" style="width:120; top:200px; left:60px; background-color:#CCCC99" onclick="selectStation()" onkeyup="selectStation()">
<option value="1" >刘备</option>
<option value="2" >关羽</option>
<option value="3" >张飞</option>
<option value="4" >马超</option>
<option value="5" >黄忠</option>
<option value="6" >赵云</option>
<option value="7" >诸葛亮</option>
</select></td>
</tr>
</table>
</div>
</form>
</BODY>
</HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<Script Language="JavaScript">
<!--
var whichText;
function selectStation(obj) {
var objSelStation = obj;
if (obj.selectedIndex != -1) {
var stationName = obj.options[obj.selectedIndex].text;
whichText.value = stationName;
}
}
//响应text的事件
var pageD =0, pageU;
function similarFind(txtObj,seledName) {
var curStationName = txtObj.value;
var objSelStation = eval("document.browser."+seledName);
var stationLength = objSelStation.options.length;
pageU = pageD;
//匹配用text中的数据跟下拉框中的数据
for (var i=0; i<stationLength; i++) {
var stationName = objSelStation.options[i].text;
var re = new RegExp("^" + curStationName);
if (stationName.match(re)) {
if (i<stationLength - 10) {
objSelStation.selectedIndex = i + 10;
}
objSelStation.selectedIndex = i;
pageD = i;
pageU = i;
break;
}
}
//响应下移键
if(event.keyCode==40) {
pageD++;
if(pageD==objSelStation.options.length) pageD=0;
txtObj.value=objSelStation.options[pageD].text ;
objSelStation.selectedIndex = pageD;
}
//响应上移键
if(event.keyCode==38) {
--pageU;
if(pageU<0) pageU=objSelStation.options.length-1;
txtObj.value = objSelStation.options[pageU].text;
objSelStation.selectedIndex = pageU;
}
} //下拉框显示位置
function showDivStation(obj, b,selName) {
var divStation = eval("document.browser."+selName);
if (b) {
whichText = obj;
divStation.style.top = 20;
divStation.style.left = 0;
divStation.style.display="block";
similarFind(obj,selName);
} else {
divStation.style.display="none";
}
}
//-->
</Script><BODY bgcolor="#FFFFFF" topmargin="0" leftmargin="0">
<form name="browser" >
<table border="1" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1">
<tr>
<td width="50%"> </td>
<td width="50%"> </td>
</tr>
<tr>
<TD width=50% bgcolor="#FFFFFF">
<input type="text" size="20" name="stationname" style="width:120" onfocus="showDivStation(this, true,'selStation')" onblur="showDivStation(this, false,'selStation')" onkeyup="similarFind(this,'selStation')" value="张飞">
<select name="selStation" size="2" style="display:none;width:120; background-color:#CCCC99" onclick="selectStation(this)" onkeyup="selectStation(this)">
<option value="1" >刘备</option>
<option value="2" >关羽</option>
<option value="3" >张飞</option>
<option value="4" >马超</option>
<option value="5" >黄忠</option>
<option value="6" >赵云</option>
<option value="7" >诸葛亮</option>
</select>
</td>
<td width="50%"> </td>
</tr>
</table>
</form>
</BODY>
</HTML>