当multiple select中内容过多,为满足软件的易用性,就需要能有搜索功能
function select_step(){ var list1 = document.getElementById("list1"); var step_name = document.getElementById("step_name").value; for (var i = 0; i < list1.options.length; i++) { if (list1.options[i].text.search(step_name) == 0) { list1.options[i].selected = true; }else { list1.options[i].selected = false; } } }
汗啊,竟然就这么简单。
一开始的思路是 把搜索符合的项 存到一个js数组中,然后再把此数组覆盖 options,这样搜索是成功了,但要搜索选择第二个并进行搜索的时候 我想的也是,将第一次搜索过后的 剩余的options存入一个新的全局变量的数组,然后将此数组内的options一个一个从新加回,但中间老是遇到一个问题:
代码运行到1处的时候正常,但运行到2处全局变量就被改变的!我一直不太清楚这是怎么一回事。搞了许久没搞定,只能寻求他路了!
希望有看出下面代码错误的朋友能给我指正!谢谢!
var temps_options = new Array();//全局变量数组 function select_step(){ var list1 = document.getElementById("list1"); var step_name = document.getElementById("step_name").value; if (step_name != "") { var selected_options = new Array(); for (var i = 0; i < list1.options.length; i++) { if (list1.options[i].text.search(step_name) == 0) { selected_options.push(list1.options[i]) } } temps_options = document.getElementById("list1").options; //将所搜剩余的options放入此数组 alert(temps_options.length);//1 list1.options.length = 0; for (var j = 0; j < selected_options.length; j++) { list1.options.add(new Option(selected_options[j].text, selected_options[j].value)); } alert(temps_options.length)//2 }else{ alert(temps_options[0].text); list1.options.length = 0; for(var i=0;i<temps_options.length;i++) { list1.options.add(new Option(temps_options[i].text,temps_options[i].value)) } } }