引导类型提前不起作用答案

【问题标题】：bootstrap type ahead not working引导类型提前不起作用
【发布时间】：2015-04-04 12:37:48
【问题描述】：

    <script type="text/javascript">
$(document).ready(function(){
        $('input').typeahead({
            name: 'accounts',
            local: []//here my data

        });
    });  
</script>



<title>Search Service</title>
</head>
<body style="background-color: black; color: white;">

    <div class="container">
        <div class="col-lg-12" style="height: 100px;">&nbsp;</div>

        <div class="col-lg-12">
            <div class="col-lg-2"></div>
            <div class="col-lg-8">
                <section class="webdesigntuts-workshop">
                    <form action="" method="">          
                        <input type="search" placeholder="Search...">
                        <input type="text" id="service" placeholder="Services" autocomplete="off">              
                        <button>Search</button>
                    </form>
                </section>      
            </div>
            <div class="col-lg-2"></div>
        </div>
    </div>


</body>
</html>

这是我的简单示例代码。我添加了 bootstrap.min.js 和 typeahead.js 用于脚本加载。它们都在浏览器中正确加载。但是前面的引导类型不起作用。

【问题讨论】：

您使用的是什么版本的 Bootstrap？您使用的是什么版本的 Typeahead？

标签： twitter-bootstrap bootstrap-typeahead

【解决方案1】：

您可能已经找到了解决方案，但我的建议是改用此 Bootstrap-3-Typeahead。它更易于使用和理解。使用该插件，以下在我的环境中工作：

HTML：

<input type="search" placeholder="Search..." data-provide="typeahead" />
<input type="text" id="service" placeholder="Services" autocomplete="off" data-provide="typeahead" />

JS：

$(document).ready(function(){
    $("input").typeahead({
        source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo']
        , minLength: 2
    });
});

希望这会有所帮助。

【讨论】：