ajax结合jQuery autocomplete 实现类似百度搜索一样的输入联想

<script src="/wdtime/scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/wdtime/scripts/jquery.autocomplete.js"></script>
<link rel="Stylesheet" href="/wdtime/styles/jquery.autocomplete.css" />
	
	<script type="text/javascript"> 
     var json = getjson();
     var pfid ;
     function getjson() {  
			 	 var result;
			     $.ajax( { 
                        type : "GET",async: false,url : "/wdtime/pages/Pfpingji/getJson.do",data : "",dataType: "json",success : function(msg) { 
                           result = msg;
                        } 
                    });  
                  return result;
	          }
	          $(function() {
                 $('#pfname').autocomplete(json,{
                    minChars: 0,//自动完成激活之前填入的最小字符
	                max:12,//列表条目数
	                cacheLength : 12,//缓存12条数据
	                width: 150,//提示的宽度
	                matchSubset:true,//是否使用服务器查询的缓存
	                scrollHeight: 300,//提示的高度
	                matchContains: true,//是否只要包含文本框里的就可以
	                autoFill:false,//自动填充
		            formatItem: function(data,i,max) {//格式化列表中的条目 row:条目对象,i:当前条目数,max:总条目数
						
						return data.to ;
		            },formatMatch: function(data,max) {//配合formatItem使用，作用在于，由于使用了formatItem，所以条目中的内容有所改变，而我们要匹配的是原始的数据，所以用formatMatch做一个调整，使之匹配原始数据
							
							return data.name + data.to;
		            },formatResult: function(data) {//定义最终返回的数据，比如我们还是要返回原始数据，而不是formatItem过的数据
						
						return data.to;
	            }
		        }).result(function(event,data,formatted){
		        		return data.name;
		        });
	           })
	           function inputClick(){
	           		var input = $("#pfname").val();
	           		$.each(json,function(idx,item){
	           			var str = item.to;
	           			if(input==str){
	           				$("#pfId").val(item.name);
	           			}
            		})
	           }
	           
</script> 

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!