js 搜索上拉框select并选中 移动目标option置顶的示例
日期：2014-05-16 浏览次数：20368 次
js 搜索下拉框select并选中 移动目标option置顶的示例
有时候,一个下拉框元素太多了就不方便选择了.可能你也有同样的感慨,拉上来拉下去就是找不到要的选项.现在就来实现一个效果:js 搜索下拉框select并选中目标选项.
先上一个完整的示例,你自己另存为html就看得到效果的:
有时候,一个下拉框元素太多了就不方便选择了.可能你也有同样的感慨,拉上来拉下去就是找不到要的选项.现在就来实现一个效果:js 搜索下拉框select并选中目标选项.
先上一个完整的示例,你自己另存为html就看得到效果的:
<!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>k686绿色软件 - http://www.k686.com/</title>
</head>
<body>
<script type="text/javascript">
function searchByName(id,value){
var spl=value.toLowerCase();//将输入值转成小写
var selectProjects=document.getElementById(id);
var options=selectProjects.options;
var total = -1;
var meetArray = new Array();
for(var i=0;i<options.length;i++){
var op_text=options[i].text.toLowerCase();//将option的文本转成小写
var opArray=op_text.split(spl);
if(spl.length>0 && opArray.length>1){ //匹配到了
total++;
meetArray[total]=i;
}
}
var beginIndex = 0;
for(var i=0;i<=total;i++){
var index = meetArray[i];
if(index!=beginIndex){
var tempText = options[index].text;
var tempValue = options[index].value;
options[index].text = options[beginIndex].text;
options[index].title = options[beginIndex].text;
options[index].value = options[beginIndex].value;
options[beginIndex].text=tempText;
options[beginIndex].title=tempText;
options[beginIndex].value=tempValue;
}
beginIndex++;
selectProjects.options[i].selected = true;
}
document.getElementById(id+"span").innerHTML=(total+1);
}
</script>
<select name="cat_id" id="cat_id"><option value="0">请选择...</option><option value="1" >汽车装饰</option><option value="11" > 车内舒适用品</option><option value="16" > 夏季凉垫</option><option value="23" > 车载冰箱</option><option value="20" > 车用空调被</option><option value="17" > 冬季毛垫</option><option value="24" > 遮阳挡</option><option value="21" > 汽车颈枕</option><option value="18" > 汽车腰靠</option><option value="22" > 汽车布艺</option><option value="19" > 汽车抱枕</option><option value="59" > 汽车防盗用品</option><option value="123" > 方向盘锁</option><option value="124" > 排挡锁</option><option value="125" > 防盗器</option><option value="39" > 汽车香水</option><option value="45" > 挂饰香水</option><option value="42" > 高级香
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
