在JSP中预先输入

时间:2017-03-08 03:01:22

标签: javascript twitter-bootstrap jsp twitter-bootstrap-3

在我的JSP中使用typeahead时,无法识别它。我尝试了不同的方法来导入离线和在线文件。

high

我的代码@Html

<script src=js/typeahead.jquery.js></script>

           or 

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.js">

我的代码@JavaScript

<div class="form-group">
   <input class="typeahead" id="input-address" type="text" placeholder="Your Address">
</div>

即使按照建议完成,我也没有得到typeahead的结果。

我等了,谢谢!

1 个答案:

答案 0 :(得分:0)

这是一个最小的工作示例。你需要加载Boostrap和jQuery。您可以按类或ID选择输入元素。

<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
<input id="input-address" type="text" placeholder="Your Address">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.js"/></script>
<script>
var $input = $("#input-address");
$input.typeahead({source: ['Washington', 'Sydney', 'Amsterdam', 'Beijing', 'Cairo']});
</script>
</body>
</html>