Bootstrap Typeahead 用法

bootstrap Typeahead 用法

例如：

<script src= "/jquery-1.7.2.min.js"></script >

<script src= "/bootstrap-typeahead.js"></script >

<input type= "text" autocomplete="off" id= "address" data-provide="typeahead" data-items="5" />

<script>

$(document).ready(function($) {

    var autoTip = new Array();

    var list = null;

    //初始化Typeahead，没有初始化，后面的调用就不起作用

    $('#address').typeahead({source: autoTip, updater: function (item) {

        //重写updater，把选中的那个项显示在指定的文本框中

        return item;

    }, matcher: function (item) {

        //重写matcher，文本框内容改变时，查询是否有匹配的内容，有则返回true，在这里可以做一些判断取值之类的操作。

        return ~item.toLowerCase().indexOf(this .query.toLowerCase());

    }});

    //再次调用Typeahead才会起作用

    $("#address").keyup( function(e){

        $.post( '', {address: $("#address").val()}, function (data) {

            autoTip.length=0;

            list = data.list;

            $.each(data.list, function() {

                autoTip.push( this.cantavil);

            });

         });

         $( '#address').typeahead({source: autoTip});

    });

})

</script>

还有不懂的，可以加QQ群详细讨论，群号：247466735