<br><br><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <br><title>下拉列表快速选择</title> <br><br><br><script type="text/javascript" language="JavaScript"><BR>// 获取拼音首字母<BR>function getPinYin(c) {<BR> execScript("tmp=asc(\""+c+"\")", "vbscript");<BR> tmp = 65536 + tmp;<BR> if(tmp>=45217 && tmp<=45252) return "A";<BR> if(tmp>=45253 && tmp<=45760) return "B";<BR> if(tmp>=45761 && tmp<=46317) return "C";<BR> if(tmp>=46318 && tmp<=46825) return "D";<BR> if(tmp>=46826 && tmp<=47009) return "E";<BR> if(tmp>=47010 && tmp<=47296) return "F";<BR> if((tmp>=47297 && tmp<=47613) || (tmp == 63193)) return "G";<BR> if(tmp>=47614 && tmp<=48118) return "H";<BR> if(tmp>=48119 && tmp<=49061) return "J";<BR> if(tmp>=49062 && tmp<=49323) return "K";<BR> if(tmp>=49324 && tmp<=49895) return "L";<BR> if(tmp>=49896 && tmp<=50370) return "M";<BR> if(tmp>=50371 && tmp<=50613) return "N";<BR> if(tmp>=50614 && tmp<=50621) return "O";<BR> if(tmp>=50622 && tmp<=50905) return "P";<BR> if(tmp>=50906 && tmp<=51386) return "Q";<BR> if(tmp>=51387 && tmp<=51445) return "R";<BR> if(tmp>=51446 && tmp<=52217) return "S";<BR> if(tmp>=52218 && tmp<=52697) return "T";<BR> if(tmp>=52698 && tmp<=52979) return "W";<BR> if(tmp>=52980 && tmp<=53688) return "X";<BR> if(tmp>=53689 && tmp<=54480) return "Y";<BR> if(tmp>=54481 && tmp<=62289) return "Z";<BR> return c.charAt(0);<BR>} <br><br>// select helper<BR>SelectHelper = new function() {<BR> // 初始化<BR> this.init = function() {<BR> document.attachEvent("onkeypress", function() {<BR> var elm = event.srcElement;<BR> if (elm.tagName == "SELECT" <BR> && elm.className.indexOf("SelectHelper") == -1) {<BR> elm.className += "SelectHelper";<BR> elm.attachEvent("onkeypress", SelectHelper.getNextKeyItem);<BR> elm.fireEvent("onkeypress", event);<BR> }<BR> });<BR> }<BR> // 获取选项文本的首字符<BR> function getItemKeyChar(option) {<BR> return option.text.charAt(0).toUpperCase();<BR> }<BR> // 查找并选中匹配的选项<BR> this.getNextKeyItem = function() {<BR> var elm = event.srcElement;<BR> var index = elm.selectedIndex + 1;<BR> do {<BR> if (index == elm.length) index = 0; <BR> if (index == elm.selectedIndex) return false; // 未找到匹配的选项，则退出<BR> } while (key2Char(event.keyCode) != getPinYin(getItemKeyChar(elm.options[index++])));<BR> elm.selectedIndex = index - 1; // 选中匹配的选项<BR> return false; // 取消原有的选择功能<BR> }<BR>};<BR>/**<BR> * 返回键盘事件对应的字母或数字<BR> * a-z: 97 -> 122 <BR> * A-Z: 65 -> 90<BR> * 0-9: 48 -> 57 <BR> */<BR>function key2Char(key) {<BR> var s = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";<BR> if (key >= 97 && key <= 122) return s.charAt(key - 97);<BR> if (key >= 65 && key <= 90) return s.charAt(key - 65);<BR> if (key >= 48 && key <= 57) return "" + (key - 48);<BR> return null;<BR>}<BR>SelectHelper.init();<BR></script><br><br><br>比如，某选项的拼音首字母为"a",只要按下键盘上的"a"，就可以快速选择该项。<br><br><select><br><option selected value="北京">北京</option> <br><option value="上海">上海</option> <br><option value="天津">天津</option> <br><option value="重庆">重庆</option> <br><option value="河北">河北</option> <br><option value="山西">山西</option> <br><option value="内蒙古">内蒙古</option> <br><option value="辽宁">辽宁</option> <br><option value="32">32</option> <br><option value="吉林">吉林</option> <br><option value="黑龙江">黑龙江</option> <br><option value="江苏">江苏</option> <br><option value="浙江">浙江</option> <br><option value="%&">&^</option> <br><option value="安徽">安徽</option> <br><option value="福建">福建</option> <br><option value="北京">A1</option> <br><option value="江西">江西</option> <br><option value="山东">山东</option> <br><option value="河南">河南</option> <br><option value="湖北">湖北</option> <br><option value="湖南">湖南</option> <br><option value="31">31</option> <br><option value="广东">广东</option> <br><option value="广西">广西</option> <br><option value="海南">海南</option> <br><option value="北京">A2</option> <br><option value="四川">四川</option> <br><option value="贵州">贵州</option> <br><option value="云南">云南</option> <br><option value="西藏">西藏</option> <br><option value="陕西">陕西</option> <br><option value="甘肃">甘肃</option> <br><option value="宁夏">宁夏</option> <br><option value="青海">青海</option> <br><option value="新疆">新疆</option> <br><option value="香港">香港</option> <br><option value="澳门">澳门</option> <br><option value="台湾">台湾</option> <br><option value="其它">其它</option> <br></select><br><select><br><option selected value="北京">北京</option> <br><option value="上海">上海</option> <br><option value="天津">天津</option> <br><option value="重庆">重庆</option> <br><option value="河北">河北</option> <br><option value="山西">山西</option> <br><option value="内蒙古">内蒙古</option> <br><option value="辽宁">辽宁</option> <br><option value="32">32</option> <br><option value="吉林">吉林</option> <br><option value="黑龙江">黑龙江</option> <br><option value="江苏">江苏</option> <br><option value="浙江">浙江</option> <br><option value="%&">&^</option> <br><option value="安徽">安徽</option> <br><option value="福建">福建</option> <br><option value="北京">A1</option> <br><option value="江西">江西</option> <br><option value="山东">山东</option> <br><option value="河南">河南</option> <br><option value="湖北">湖北</option> <br><option value="湖南">湖南</option> <br><option value="31">31</option> <br><option value="广东">广东</option> <br><option value="广西">广西</option> <br><option value="海南">海南</option> <br><option value="北京">A2</option> <br><option value="四川">四川</option> <br><option value="贵州">贵州</option> <br><option value="云南">云南</option> <br><option value="西藏">西藏</option> <br><option value="陕西">陕西</option> <br><option value="甘肃">甘肃</option> <br><option value="宁夏">宁夏</option> <br><option value="青海">青海</option> <br><option value="新疆">新疆</option> <br><option value="香港">香港</option> <br><option value="澳门">澳门</option> <br><option value="台湾">台湾</option> <br><option value="其它">其它</option> <br></select><br><br>
