用文本框中在下拉列表中搜索用JS来实现,该如何解决
日期：2014-05-16 浏览次数：20354 次
用文本框中在下拉列表中搜索用JS来实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:100px;
top:37px;
width:200px;
height:60px;
z-index:1;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: outset;
border-right-style: outset;
border-bottom-style: outset;
border-left-style: outset;
}
body,td,th {
font-size: 9pt;
}
-->
</style>
<SCRIPT language="JavaScript">
var OldValue;
OldValue = "";
function chazhao(NewValue)
{
var ss=""
if(NewValue=="")
{
return false;
}
if (OldValue != NewValue)
{
OldValue = NewValue;
var sels=document.getElementById("sel");
//alert(sels.options[1].innerText);
var le=sels.options.length;
for(i=0;i <le;i++)
{
if((sels.options[i].innerText).indexOf(NewValue)!=-1)
{
ss=ss+" <span style=width:147;cursor:hand onMouseover=this.style.background='#cccccc' onMouseout=this.style.background='#ffffff' onclick=document.getElementById('Layer1').style.display='none';document.getElementById('wenben').value='"+sels.options[i].innerText+"'> "+sels.options[i].innerText+" </span> <br> "
}
if(ss!="")
{
document.getElementById("jieguo").innerHTML=ss;
document.getElementById("Layer1").style.display="";
}
}
}
}
</script>
<select id="sel" style="width:147;margin-left:-133">
<option value="我们"> 我们 </option>
<option value="张一"> 张一 </option>
<option value="张二"> 张二 </option>
<option value="张四"> 张四 </option>
<option value="李二"> 李二 </option>
<option value="爱在西元"> 爱在西元 </option>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:100px;
top:37px;
width:200px;
height:60px;
z-index:1;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: outset;
border-right-style: outset;
border-bottom-style: outset;
border-left-style: outset;
}
body,td,th {
font-size: 9pt;
}
-->
</style>
<SCRIPT language="JavaScript">
var OldValue;
OldValue = "";
function chazhao(NewValue)
{
var ss=""
if(NewValue=="")
{
return false;
}
if (OldValue != NewValue)
{
OldValue = NewValue;
var sels=document.getElementById("sel");
//alert(sels.options[1].innerText);
var le=sels.options.length;
for(i=0;i <le;i++)
{
if((sels.options[i].innerText).indexOf(NewValue)!=-1)
{
ss=ss+" <span style=width:147;cursor:hand onMouseover=this.style.background='#cccccc' onMouseout=this.style.background='#ffffff' onclick=document.getElementById('Layer1').style.display='none';document.getElementById('wenben').value='"+sels.options[i].innerText+"'> "+sels.options[i].innerText+" </span> <br> "
}
if(ss!="")
{
document.getElementById("jieguo").innerHTML=ss;
document.getElementById("Layer1").style.display="";
}
}
}
}
</script>
<select id="sel" style="width:147;margin-left:-133">
<option value="我们"> 我们 </option>
<option value="张一"> 张一 </option>
<option value="张二"> 张二 </option>
<option value="张四"> 张四 </option>
<option value="李二"> 李二 </option>
<option value="爱在西元"> 爱在西元 </option>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
