关于使用bootstrap实现自动补全功能，本文以Grails框架为例

前台HTML：

<input type="text" name="id1" autocomplete="off" class="typeahead"  />

JS：

$('.typeahead').typeahead({
                 source:function(query, process)
                 {
                     $.ajax({
                         url: '${createLink(action: "autocomplenum")}',
                         type: 'GET',
                         dataType: 'JSON',
                         async: true,
                         data: 'num=' + query ,
                         success: function(data)
                         {
                             var arr = [];
                             for (i in data)
                             {
                                 arr.push(data[i]['num']);
                             }
                             process(arr);
                         }
                     });
                 }
             })

后台：

def autocomplenum(){

            List materiallist = Material.findAllByNumLike('%'+params.num+'%')

           render(contentType: "text/json"){

               materialList:materiallist
           }

     }