bootstarp 实现输入提示(auto complete)

什么是输入提示?看看截图

需要引入一个插件,bootstrap-typeahead.js,这是bootstarp的插件,很好下载

在jsp中需要定义一个输入框:

1 <div class="controls">
2          <textarea rows="1" cols="8" id="teacher_search"type="text" data-provide="typeahead"
3           placeholder="请输入..." ></textarea>
4  </div>

这个看个人喜好了,也可以写成这样的:

1 <div class = "span4 ">
2     <input type="text" data-provide="typeahead" id = “teacher_search”>
3 </div>

我之所以会选择第一种,只是因为我比较喜欢<textarea>标签,格式也比较好看

 

js文件中的内容:

这部分内容也可以写在jsp中

1  $('#teacher_search').typeahead({
2          source:  ['C1307890', 'C1201010', 'C0506110','C0609001','C0712111','C1101022']
3  
4   });

ok了!so easy!

附上属性:

 

 

 

 

posted @ 2014-03-24 14:56  暖暖的拥抱  阅读(955)  评论(0编辑  收藏  举报