下拉列表框城市列表键盘字母索引

简单的城市选择键盘字母索引,枯燥,但不复杂

<select name="city" onkeydown="go();" id="suoyin">
<optgroup label="----A----" style="background:#FFBCB3;"/>
  <option value="0606" style="background:#fff;" sp="ALSK">阿拉山口</option>
<option value="0502" style="background:#fff;" sp="AS">鞍山</option>
<optgroup label="----B----" style="background:#FFBCB3;"/>
<option value="0916" style="background:#fff;" sp="BYJG">鲅鱼圈港</option>
<option value="0906" style="background:#fff;" sp="BLG">北仑港</option>
<option value="0620" style="background:#fff;" sp="BJ">宝鸡</option>
<optgroup label="----C----" style="background:#FFBCB3;"/>
<option value="0426" style="background:#fff;" sp="CG">长葛</option>
<option value="0914" style="background:#fff;" sp="CJT">曹妃甸</option>
<optgroup label="----D----" style="background:#FFBCB3;"/>
<option value="0909" style="background:#fff;" sp="DLG">大连港</option>
<option value="0706" style="background:#fff;" sp="DC">德昌</option>
<optgroup label="----E----" style="background:#FFBCB3;"/>
<option value="0409" style="background:#fff;" sp="EZ">鄂州</option>
<option value="0234" style="background:#fff;" sp="EEDS">鄂尔多斯</option>
<optgroup label="----F----" style="background:#FFBCB3;"/>
<option value="0248" style="background:#fff;" sp="FC">阜城</option>
<option value="0910" style="background:#fff;" sp="FCG">防城港</option>
<optgroup label="----G----" style="background:#FFBCB3;"/>
<option value="0719" style="background:#fff;" sp="GX">广西</option>
<option value="0717" style="background:#fff;" sp="GZ">贵州</option>
<optgroup label="----H----" style="background:#FFBCB3;"/>
<option value="0103" style="background:#fff;" sp="HZ">杭州</option>
<option value="0105" style="background:#fff;" sp="HF">合肥</option>
<optgroup label="----J----" style="background:#FFBCB3;"/>
<option value="0316" style="background:#fff;" sp="JY">揭阳</option>
<option value="0716" style="background:#fff;" sp="JS">建水</option>
<optgroup label="----K----" style="background:#FFBCB3;"/>
<option value="0704" style="background:#fff;" sp="KM">昆明</option>
<option value="0303" style="background:#fff;" sp="KJ">湛江</option>

<optgroup label="----L----" style="background:#FFBCB3;"/>
<option value="0912" style="background:#fff;" sp="LSG">岚山港</option>
<option value="0425" style="background:#fff;" sp="LL">汨罗</option>
<optgroup label="----M----" style="background:#FFBCB3;"/>
<option value="0723" style="background:#fff;" sp="MY">绵阳</option>
<option value="0613" style="background:#fff;" sp="MH">民和</option>
<optgroup label="----N----" style="background:#FFBCB3;"/>
<option value="0314" style="background:#fff;" sp="NH">南海</option>
<option value="0143" style="background:#fff;" sp="NT">南通</option>
<optgroup label="----P----" style="background:#FFBCB3;"/>
<option value="0720" style="background:#fff;" sp="PZH">攀枝花</option>
<option value="0416" style="background:#fff;" sp="PDS">平顶山</option>
<optgroup label="----Q----" style="background:#FFBCB3;"/>
<option value="0317" style="background:#fff;" sp="QY">清远</option>
<option value="1001" style="background:#fff;" sp="QTSF">其他省份</option>
<optgroup label="----R----" style="background:#FFBCB3;"/>
<option value="0104" style="background:#fff;" sp="RZ">扬州</option>
<option value="0905" style="background:#fff;" sp="RZG">日照港</option>
<option value="0134" style="background:#fff;" sp="RZ">日照</option>
<optgroup label="----S----" style="background:#FFBCB3;"/>
<option value="0101" style="background:#fff;" sp="SH">上海</option>
<option value="0158" style="background:#fff;" sp="SY">松阳</option>
<optgroup label="----T----" style="background:#FFBCB3;"/>
<option value="0163" style="background:#fff;" sp="TZ">泰州</option>
<option value="0156" style="background:#fff;" sp="TZ">台州</option>
<optgroup label="----W----" style="background:#FFBCB3;"/>
<option value="0102" style="background:#fff;" sp="WX">无锡</option>
<option value="0614" style="background:#fff;" sp="WW">武威</option>
<optgroup label="----X----" style="background:#FFBCB3;"/>
<option value="0907" style="background:#fff;" sp="XMG">厦门港</option>
<option value="0603" style="background:#fff;" sp="XN">西宁</option>
<optgroup label="----Y----" style="background:#FFBCB3;"/>
<option value="0162" style="background:#fff;" sp="YK">永康</option>
<option value="0705" style="background:#fff;"sp="YN">云南</option>
<optgroup label="----Z----" style="background:#FFBCB3;"/>
<option value="0908" style="background:#fff;" sp="ZJG">湛江港</option>
<option value="0419" style="background:#fff;" sp="ZZ">株洲</option>
</select>
<script type="text/javascript">
var sel="",timer=null;
function go(){
with(window.event){
with(srcElement){
if(keyCode<48)return;
if(keyCode>95)keyCode-=48
sel+=String.fromCharCode(keyCode)
window.status=sel
for(i=0;i<length;i++){
if(document.getElementByIdx("suoyin").options[i].sp.indexOf(sel)==0){document.getElementByIdx("suoyin").selectedIndex=i;break;}
}
}
returnValue=false;
clearTimeout(timer)
timer=setTimeout("sel=''",500);
}
}
</script>