<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代码中是否有任何问题。