Typeahead引导代码

时间:2017-03-06 15:22:49

标签: javascript jquery twitter-bootstrap

<html lang="en">
<head>
    <title>Bootstrap Typeahead with Ajax Example</title>  
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.1/bootstrap3-typeahead.min.js"></script>  
</head>
<body>

<div class="row">
    <div class="col-md-12 text-center">
        <br/>
        <h1>Search Here</h1>    
            <input id="my-input"class="typeahead form-control" style="margin:0px auto;width:300px;" type="text">
    </div>
</div>

<script type="text/javascript">
    // Waiting for the DOM ready...
    $(function(){

      // applied typeahead to the text input box
      $('#my-input').typeahead({
        name: 'countries',

        // data source
        prefetch: 'countries.json',

        // max item numbers list in the dropdown
        limit: 10
      });

    });
  </script>
</body>
</html>

我在&#34; countries.json&#34;中给了国名。但搜索框对我不起作用。如何解决这个问题? ... 在js代码中是否有任何问题。

0 个答案:

没有答案