纯JS 输入框 onkeyup 下拉框

来源：互联网发布：可用多多返利源码编辑：程序博客网时间：2024/05/21 20:19

页面：

<!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>  </head><body>  <table><tr> <td>         <input type="text" id = "PRED_TSK_CD_TEXT" style="width:46%"/>                 <select id="PRED_TSK_CD" name="PRED_TSK_CD" style="width:48%;" onchange="PRED_TSK_CD_TEXT.value=options[selectedIndex].text;"></select></td></tr></table></body></html>

JS写法

<%//--------------------------------------------------------------------------------------------------//下拉模糊查询//--------------------------------------------------------------------------------------------------%>function LoadSelect(){var SelectObj = document.getElementById("PRED_TSK_CD_TEXT");var OptionObj = document.getElementById("PRED_TSK_CD").options;var List = [];    for (var i = 0; i < OptionObj.length; i++) {          List[i] = OptionObj[i].value + "|" + OptionObj[i].text;      }      SelectObj.onkeyup = function() {              OptionObj.length = 0;              for (var i = 0; i < List.length; i++) {                if (List[i].indexOf(SelectObj.value) > -1) {                 OptionObj.add(new Option(List[i].split("|")[1], List[i].split("|")[0]));                 }            }      };  }

1 0