js实现Select下拉框具有输入功能的方法
本文实例讲述了js实现Select下拉框具有输入功能的方法。分享给大家供大家参考。具体实现方法如下：
实现方法一
<HTML> <HEAD> <METAhttp-equiv='Content-Type'content='text/html;charset=gb2312'> <TITLE>js实现可输入的下拉框</TITLE> </HEAD> <BODY> <divstyle="position:relative;"> <spanstyle="margin-left:100px;width:18px;overflow:hidden;"> <selectstyle="width:118px;margin-left:-100px"onchange="this.parentNode.nextSibling.value=this.value"> <optionvalue="德国">德国</option> <optionvalue="挪威">挪威</option> <optionvalue="瑞士">瑞士</option> </select></span><inputname="box"style="width:100px;position:absolute;left:0px;"> </div> </BODY> </HTML>
实现方式二
<selectid="select"onkeydown="Select.del(this,event)"onkeypress="Select.write(this,event)">
<optionvalue=""></option>
<optionvalue="aaa">aaa</option>
<optionvalue="bbb">bbb</option>
<optionvalue="ccc">ccc</option>
</select>
<inputtype="button"value="获取选择值"id="test"onclick="test();"/>
<script>
varSelect={
del:function(obj,e){
if((e.keyCode||e.which||e.charCode)==8){
varopt=obj.options[0];
opt.text=opt.value=opt.value.substring(0,opt.value.length>0?opt.value.length-1:0);
}
},
write:function(obj,e){
if((e.keyCode||e.which||e.charCode)==8)return;
varopt=obj.options[0];
opt.selected="selected";
opt.text=opt.value+=String.fromCharCode(e.charCode||e.which||e.keyCode);
}
}
functiontest(){
alert(document.getElementById("select").value);
}
</script><br/>
希望本文所述对大家的javascript程序设计有所帮助。
热门推荐
10 喜得孙子祝福语简短唯美
11 婚礼祝福语简短朴实大众
12 员工周年祝福语大全简短
13 家长回复节日祝福语简短
14 简短生日祝福语老同学
15 夜雨祝福语简短10字
16 蛋糕祝福语简短闺蜜
17 部门过年祝福语简短独特
18 简短精炼的结婚祝福语