jquery模拟可输入的下拉框

//页面html
<div id="select" class="select" ><ul><c:forEach items="${movieCityList}" var="cy" varStatus="st"><li><a href="javascript:void(0)" onclick="selectOption($(this))">${cy.cityName}</a><input style="display: none;" name="cityCode" id="cityCode${st.count }" value="${cy.vasCityId}"/></li></c:forEach></ul></div>

//jquery代码
<script type="text/javascript">//城市下拉框函数function getData(){//获取全部城市数据var data=new Array();$(".select a").each(function(i){data[i]=$(this).html();});return data;}function judgeLength(l){//依据结果显示下拉框高度if(l>5){$(".select").css("height","100px");}else{$(".select").css("height",l*20+"px");}}function selectOption(obj){//选中$("#cityName").val(obj.html());$("#cityId").val(obj.next("input").val());$(".select").hide();loadCinemalName();}function onFocus(){//input标签获取焦点var l=getData().length;if($('#cityName').val()==''){judgeLength(l);$(".select").show();}else{var obj=$("#cityName");onKeyUp(obj);}}function onKeyUp(obj){//input keyup事件var input=obj.val()+'';$(".select li").hide();var height=0;   var data=getData();var l=getData().length;if(input!=''){//输入时动态检索是否存在所输入的城市for(var i=0;i<data.length;i++){var str=data[i]+"";if(str.indexOf(input)!=-1){height++;judgeLength(height);$(".select").show();$(".select li:eq("+i+")").show();var cityId=$(".select li:eq("+i+") input").val();$("#cityId").val(cityId);}}loadCinemalName();}else{judgeLength(l);$(".select li").show();}}function onBlur(e){//失去焦点时隐藏下拉框alert(e.target);//$(".select").hide();}</script>