标题 | js实现下拉框具有输入功能的方法 |
范文 | 这篇文章主要介绍了js实现select下拉框具有输入功能的方法,实例分析了两种比较常见的实现方法,是非常实用的技巧,需要的朋友可以参考下 本文实例讲述了js实现select下拉框具有输入功能的方法。分享给大家供大家参考。具体实现方法如下: 实现方法一 代码如下: <html> <head> <meta http-equiv='content-type' content='text/html; charset=gb2312'> <title>js实现可输入的下拉框</title> </head> <body> <div style=position:relative;> <span style=margin-left:100px;width:18px;overflow:hidden;> <select style=width:118px;margin-left:-100px onchange=this.parentnode.nextsibling.value=this.value> <option value=德国>德国</option> <option value=挪威>挪威</option> <option value=瑞士> 瑞士</option> </select></span><input name=box style=width:100px;position:absolute;left:0px;> </div> </body> </html> 实现方式二 代码如下: <select id=select onkeydown=select.del(this,event) onkeypress=select.write(this,event)> <option value=></option> <option value=aaa>aaa</option> <option value=bbb>bbb</option> <option value=ccc>ccc</option> </select> <input type=button value=获取选择值 id=test onclick=test();/> <script> var select = { del : function(obj,e){ if((e.keycode||e.which||e.charcode) == 8){ var opt = 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 ; var opt = obj.options[0]; opt.selected = selected; opt.text = opt.value += string.fromcharcode(e.charcode||e.which||e.keycode); } } function test(){ alert(document.getelementbyid(select).value); } </script><br /> |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。