码迷,mamicode.com
首页 > Web开发 > 详细

jQuery AutoComplete 自动补全

时间:2016-07-08 10:13:28      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:

jQuery.AutoComplete是一个基于jQuery的自动补全插件。借助于jQuery优秀的跨浏览器特性,可以兼容Chrome/IE/Firefox/Opera/Safari等多种浏览器。

特性一览:

  • 支持补全列表的宽度设定。
  • 支持补全列表的最大高度设定。
  • 支持补全列表的行数限制。
  • 支持补全列表的显示位置及方向的设定。
  • 支持自定义匹配规则。
  • 支持匹配文本的渲染。
  • 支持自定义匹配文本的渲染样式。
  • 支持补全列表的样式设定。
  • 支持自定义补全列表项的创建。
  • 支持多种数据源。
  • 支持‘json‘和‘xml‘两种数据格式。
  • 支持异步处理。
  • 支持错误调试。
  • 支持jQuery1.7.1+。

  • github

在线实例

实例预览 自动补全基本实例

实例预览 自动补全功能实例

参考手册 jQuery.AutoComplete API文档

引入文件

  1. <script type="text/javascript" src="jquery1.8.3.min.js"></script>
  2. <link rel="stylesheet" type="text/css" href="jquery.autocomplete.css">
  3. <script type="text/javascript" src="jquery.autocomplete.min.js"></script>
复制

使用方法

  1. <input type="text" id="down" value="e"></input>
复制
  1.  $(‘#down‘).AutoComplete({
  2.     ‘data‘: [‘One‘, ‘Two‘, ‘Three‘, ‘Four‘, ‘Five‘, ‘Six‘, ‘Seven‘, ‘Eight‘, ‘Nine‘, ‘Ten‘, ‘Eleven‘, ‘Twelve‘],
  3.     ‘itemHeight‘: 20,
  4.     ‘width‘: 280
  5. }).AutoComplete(‘show‘);
复制

 

jQuery AutoComplete 自动补全

标签:

原文地址:http://www.cnblogs.com/androidshouce/p/5652256.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!