<script type="text/javascript" src="http://www.mamicode.com/javascript/jquery-1.7.min.js"></script><link rel="stylesheet" href="http://www.mamicode.com/javascript/menuui/jquery-ui.css" ><script src="http://www.mamicode.com/javascript/autocomplete/jquery.ui.core.js"></script><script src="http://www.mamicode.com/javascript/autocomplete/jquery.ui.widget.js"></script><script src="http://www.mamicode.com/javascript/autocomplete/jquery.ui.position.js"></script><script src="http://www.mamicode.com/javascript/autocomplete/jquery.ui.menu.js"></script><script src="http://www.mamicode.com/javascript/autocomplete/jquery.ui.autocomplete.js"></script>

<style type="text/css">    .ui-autocomplete{        display:block;        z-index:99999;        width: 200px;    }</style>

 1 $( "#vip_code" ).autocomplete({ 2             source: function(request, response){ 3                 $.ajax({ 4                     type : "POST", 5                     url :"<%=basePath%>" + "/xfz/customer.do", 6                     data : "action=autoSearch&key="+$("#vip_code").val(), 7                     dataType : "json", 8                     success : function(jsonObj) { 9                         response(jsonObj);10                     }11                 });12             },13             minLength:2, //至少得有2个字符才能触发自动匹配的动作14             select: function( event, ui ) {15                 $("#customer_name").val(ui.item.name);16             }17         })18         .data( "ui-autocomplete" )._renderItem = function( ul, item ) {19             return $( "<li>" )20                 .append( "<a style=‘font-size:12px;font-family: 微软雅黑;‘>" + item.value + "," + item.name + "," + item.mobilephone + "</a>" )21                 .appendTo( ul );22         };

 1 public class CustomerAutoInfo { 2     //value is key value(vipcode/username) 3     private String value; 4     private String name; 5     private String mobilephone; 6      7     public String getValue() { 8         return value; 9     }10     public void setValue(String value) {11         this.value =http://www.mamicode.com/ value;12     }13     public String getName() {14         return name;15     }16     public void setName(String name) {17         this.name = name;18     }19     public String getMobilephone() {20         return mobilephone;21     }22     public void setMobilephone(String mobilephone) {23         this.mobilephone = mobilephone;24     }25 }

VIP信息员编码 <input type="text" id="vip_code"  onkeydown=‘return checkNum()‘ style="ime-mode:Disabled" onpaste="return !clipboardData.getData(‘text‘).match(/\D\./)"  ondragenter="return false" class="searchinput" /><label for="customer_name" style="width: 100px;text-align: right;">消费者姓名</label><input type="text" id="customer_name"  onkeydown="if(event.keyCode==32) return false" class="searchinput" />