js使下拉列表框可编辑不止是选择

160 阅读 0 评论 106 点赞

我是靠谱客的博主多情煎饼，最近开发中收集的这篇文章主要介绍js使下拉列表框可编辑不止是选择，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

 
<script> 
function clearOption(obj,e){ 
var currKey=0,e=e||event; 
currKey=e.keyCode||e.which||e.charCode; 
if(currKey == 8){ 
obj.options[0].text = ""; 
} 
} 
function writeSelect(obj,e){ 
var currKey=0,e=e||event; 
currKey=e.keyCode||e.which||e.charCode; 
obj.options[0].selected = "select"; 
if(currKey != 8){//这个地方是为了避免在firefox又出现令人厌烦的乱码,可以试试注释这句话，看看在firefox的效果 
obj.options[0].text = obj.options[0].text + String.fromCharCode(currKey); 
} 
e.returnValue=false; 
return obj.options[0].text; 
} 
function ttt(){ 
var jg = document.getElementById("aa").options[document.getElementById("aa").selectedIndex].text; 
//当然也可以在前面的writeSelect函数里面同时设置options的value，这样的话，直接可以在该程序里面用value取出 
jQuery("#aa").empty(); 
jQuery("#aa").append("<option value=''></option>"); 
} 

</script> 

复制代码代码如下:

 
<select style='width:150px;z-index:-1' id="aa" name="selectHelpCode" onkeydown="clearOption(this,event)" onkeypress="writeSelect(this,event)"> 
<option value=""></option> 
<option value="11">11</option> 
<option value="22">22</option> 
<option value="33">33</option> 
</select> 
<input type="button" value="清除" onclick="ttt();"/> 