关于jquery的jquery.autocomplete(自动补全)插件的个人理解

1.引进js和css

[html] <script type="text/javascript" src="${ctx }/script/jquery-1.7.2.js"></script>
<script type='text/javascript' src='${ctx }/js/jquery.bgiframe.min.js'></script>
<script type='text/javascript' src='${ctx }/js/jquery.ajaxQueue.js'></script>
<script type="text/javascript" src="${ctx }/js/jquery.autocomplete.js"></script>
<script type='text/javascript' src='${ctx }/js/thickbox-compressed.js'></script>

<link rel="stylesheet" type="text/css" href="${ctx }/js/jquery.autocomplete.css"></link>

[javascript] ?$(document).ready(function(){
            $('#keyword').autocomplete("${ctx}/system/ajaxLoadUser.action", //url路径
             {
                //max: 10,    //列表里的条目数
                minChars: 0,    //自动完成激活之前填入的最小字符
                width: 400,     //提示的宽度，溢出隐藏
                scrollHeight: 300,   //提示的高度，溢出显示滚动条
                matchContains: true,    //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示
                autoFill: false,    //自动填充
                dataType: 'json',   //数据类型,json || xml
                extraParams:{keyword:function() { return $('#keyword').val();}},   //传参,后台查询的条件
                parse: function(data) {   //重写parse方法,用来解析json
                    var rows = [];
                    for(var i=0; i<data.length; i++){
                    rows[rows.length] = {
                       data:data[i],
                       value:data[i].id,
                       result:data[i].name
                       };
                     }
                    return rows;
                },
                formatItem: function(row, i, max) {
                    return i + '/' + max + ':"' + row.name + '"[' + row.id + ']';   //解释界面显示,看下图片你就明白了
                },
                formatMatch: function(row, i, max) {
                    return row.name + row.id;
                },
                formatResult: function(row) {
                    return row.name;
                }
            }).result(function(event, row, formatted) {   //选中触发的方法
                $("#userId").val(row.id);
                //alert(row.id);
            });

$(document).ready(function(){
            $('#keyword').autocomplete("${ctx}/system/ajaxLoadUser.action", //url路径
             {
                //max: 10,    //列表里的条目数
                minChars: 0,    //自动完成激活之前填入的最小字符
                width: 400,     //提示的宽度，溢出隐藏
                scrollHeight: 300,   //提示的高度，溢出显示滚动条

补充：web前端 , JavaScript ,