html 下拉列表 模糊查询,JS Select下拉框(支持输入模糊查询)

Insert title here

function SelectValue(obj)

{

document.all.box2.value = obj.options[obj.selectedIndex].text;

}

var j = 0;

function InputValue(obj)

{

var n = 1;

var tmpObj;

var src = document.all.SelectOption;

var msg = document.all.msg;

if(event.keyCode != 40 && event.keyCode != 38 && event.keyCode != 13){

if(obj.value!=""){

msg.style.display="";

msg.innerHTML="";

if(msg.hasChildNodes())

{

msg.childNodes[0].parentNode.removeChild(msg.childNodes[0]);

}

for (var i=0;i

var selValue = document.createElement("div");

var selText = document.createElement("div");

selText.value = src(i).value;

selText.innerHTML = src(i).text;

if (src(i).text.toLowerCase().indexOf(obj.value.toLowerCase())==0){

selText.setAttribute("id","selText"+n);

selText.οnmοuseοver=function (){

this.style.backgroundColor='#003399';

this.style.color ='#ffffff';

}

selText.οnmοuseοut=function (){

this.style.backgroundColor='#ffffff';

this.style.color ='#000000';

}

selText.οnclick=function (){

document.all.box2.value = this.innerHTML;

msg.style.display="none";

document.getElementById("txtSection").value=this.value;

}

msg.appendChild(selText);

n++;

}

}

}

else {

document.all.msg.style.display="none";

}

}

else {

//press down key

if(event.keyCode==40){

j++;

for (var i=0; i

{

tmpObj = document.getElementById("selText"+i);

if(tmpObj != null){

tmpObj.style.backgroundColor='#ffffff';

tmpObj.style.color ='#000000';

}

}

tmpObj = document.getElementById("selText"+j);

if(tmpObj != null){

tmpObj.style.backgroundColor='#003399';

tmpObj.style.color ='#ffffff';

}else{

j = 0;

}

}

//press up key

if (event.keyCode==38){

j--;

for (var i=0; i

{

tmpObj = document.getElementById("selText"+i);

if(tmpObj != null){

tmpObj.style.backgroundColor='#ffffff';

tmpObj.style.color ='#000000';

}

}

tmpObj = document.getElementById("selText"+j);

if(tmpObj != null){

tmpObj.style.backgroundColor='#003399';

tmpObj.style.color ='#ffffff';

}else{

j = 2;

}

}

//press enter key

if (event.keyCode==13){

tmpObj = document.getElementById("selText"+j);

document.all.box2.value = tmpObj.innerHTML;

msg.style.display="none";

document.getElementById("txtSection").value=tmpObj.value;

}

}

}

function SelMatch(src)

{

var currSel = document.all.box2.value;

for (var i=0;i

if (src(i).text==currSel)

{

src.options(i).selected = true;

}

}

}

function NoMsg()

{

if(document.activeElement.id=="msg")

return false;

else

document.all.msg.style.display='none';

}

查询	ALL 管理者1 管理者2 管理者3 业务员3 业务员3 13 103