输入框提示自动提示类似百度，淘宝的输入框详解编程语言

jquery autoComplete插件

1.需要的js和样式（jquery 是必选的）

<script src="${ctx}/js/jquery/jquery-1.7.2.js" type="text/javascript"></script> 
<script src="${ctx}/js/jquery/jquery-ui-1.9.2.custom.js" type="text/javascript"></script> 
    <script src="${ctx}/js/jquery/jquery.ui.core.js" type="text/javascript"></script> 
    <script src="${ctx}/js/jquery/jquery.ui.widget.js" type="text/javascript"></script> 
    <script src="${ctx}/js/jquery/jquery.ui.position.js" type="text/javascript"></script> 
    <script src="${ctx}/js/jquery/jquery.ui.autocomplete.js" type="text/javascript"></script> 
    <link href="${ctx}/js/jquery/css/jquery.ui.autocomplete.css" rel="stylesheet" type="text/css" />

2. js

    $("#pName").autocomplete({ 
                source: function(request, response ) { 
                    $.ajax({ 
                        url: "${ctx}/xxxx/xxxxx.do", 
                        dataType: "json", 
                        data:{ 
                            name: request.term 
                        }, 
                        success: function(data) { 
                            response($.map(eval(data), function(item) { 
                                return { 
                                    uid:item.id, 
                                    value:item.person.name+"-"+item.person.mobile 
                                } 
                            })); 
                        } 
                    }); 
                }, 
                minLength:1, 
                select:function(event,ui) { 
                    $("#pid").val(ui.item.uid); 
                    $("#pName").val(ui.item.value); 
                } 
            });

3.jsp元素

<tr> 
                <td><input type="text" id="pName" value=""/></td> 
                <td><input type="hidden" id="pid"></td> 
                <td><input type="button"  id="submitProjectPerson" value="添加成员"/></td> 
                <td><span id="flagError" style="color:red"></td> 
            </tr>