上拉列表中的内容排序有关问题
日期：2014-05-16 浏览次数：20470 次
下拉列表中的内容排序问题，求助
我目前需要干一件这样的事，下拉列表的代码如下:
当然还有很多option，共有22个。现在需要这样做，要求能在下拉列表中输入一个字母（这个字母是某个选择项的首字母），然后下拉列表自动显示那个选择项。比如输入“S”，则下拉列表显示的是“食少”这一项。求大神帮帮我解决这个问题，再次拜谢了
------解决方案--------------------
<!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=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function ShowContext(seid,txid){
this.context=["2","22","222","2222","22222","222222","2222222","22222222"];
this.oselect=document.getElementById(seid);
this.otext=document.getElementById(txid);
}
ShowContext.prototype.shows=function(){
var txvalue=this.otext.value;
this.oselect.length=0;
for(var i=0;i<this.context.length;i++){
if(this.context[i].indexOf(txvalue)==0){
var o=new Option(this.context[i],this.context[i]);
o.ondblclick=getcontext;
this.oselect[this.oselect.length]=o;
}
}
this.oselect.size=this.oselect.length>3?this.oselect.length:3;
this.isshow();
}
ShowContext.prototype.addcontext=function(){
var context=this.otext.value;
var m=0;
for(var i=0;i<this.context.length;i++){
if(this.context[i]!=context){
m+=1;
}else{
break;
}
}
if(m==this.context.length){
this.context.push(context);
}
this.otext.value="";
}
ShowContext.prototype.isshow=function(){
if(this.oselect.length){
this.oselect.style.display="";
}else{
this.oselect.style.display="none";
}
}
function getcontext(){
var context=this.value;
var oselect=document.getElementById("select");
var otext=document.getElementById("text");
otext.value=context;
oselect.length=0;
oselect.style.display="none";
}
var s;
window.onload=function(){
s=new ShowContext("select","text");
}
</script>
</head>
<body>
<input type="text" id="text" onkeyup="s.shows()"><input type="button" onclick="s.addcontext()" value="add"><br/>
<select id="select" style="display:none">
</select>
</body>
</html>
以前写的一个 将就着看吧 哈
我目前需要干一件这样的事，下拉列表的代码如下:
- HTML code
<select name="select" id="select">
<option value="0">乏力</option>
<option value="1">消瘦</option>
<option value="2">食少</option>
<option value="3">头晕</option>
</select>
当然还有很多option，共有22个。现在需要这样做，要求能在下拉列表中输入一个字母（这个字母是某个选择项的首字母），然后下拉列表自动显示那个选择项。比如输入“S”，则下拉列表显示的是“食少”这一项。求大神帮帮我解决这个问题，再次拜谢了
------解决方案--------------------
<!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=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function ShowContext(seid,txid){
this.context=["2","22","222","2222","22222","222222","2222222","22222222"];
this.oselect=document.getElementById(seid);
this.otext=document.getElementById(txid);
}
ShowContext.prototype.shows=function(){
var txvalue=this.otext.value;
this.oselect.length=0;
for(var i=0;i<this.context.length;i++){
if(this.context[i].indexOf(txvalue)==0){
var o=new Option(this.context[i],this.context[i]);
o.ondblclick=getcontext;
this.oselect[this.oselect.length]=o;
}
}
this.oselect.size=this.oselect.length>3?this.oselect.length:3;
this.isshow();
}
ShowContext.prototype.addcontext=function(){
var context=this.otext.value;
var m=0;
for(var i=0;i<this.context.length;i++){
if(this.context[i]!=context){
m+=1;
}else{
break;
}
}
if(m==this.context.length){
this.context.push(context);
}
this.otext.value="";
}
ShowContext.prototype.isshow=function(){
if(this.oselect.length){
this.oselect.style.display="";
}else{
this.oselect.style.display="none";
}
}
function getcontext(){
var context=this.value;
var oselect=document.getElementById("select");
var otext=document.getElementById("text");
otext.value=context;
oselect.length=0;
oselect.style.display="none";
}
var s;
window.onload=function(){
s=new ShowContext("select","text");
}
</script>
</head>
<body>
<input type="text" id="text" onkeyup="s.shows()"><input type="button" onclick="s.addcontext()" value="add"><br/>
<select id="select" style="display:none">
</select>
</body>
</html>
以前写的一个 将就着看吧 哈
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
