jquery autoComplete 插件
github:
https://github.com/Pixabay/jQuery-autoComplete/blob/master/demo.html
官网demo
https://goodies.pixabay.com/jquery/auto-complete/demo.html
cdn:
<script src='//cdn.bootcss.com/jquery-autocomplete/1.0.7/jquery.auto-complete.min.js'></script> <link href='//cdn.bootcss.com/jquery-autocomplete/1.0.7/jquery.auto-complete.min.css' rel='stylesheet'>
我的demo:
参数1:term 为 文本框输入的内容
参数2:suggest 是一个核心函数,将字符串数组添加到自动完成的列表中
$(function()
{
$('#exampleInputAmount').autoComplete({
minChars: 1,
source: function(term, suggest){
term = term.toLowerCase();
var choices = ['ActionScript', 'AppleScript', 'Asp', 'Assembly', 'BASIC', 'Batch', 'C', 'C++', 'CSS', 'Clojure', 'COBOL', 'ColdFusion', 'Erlang', 'Fortran', 'Groovy', 'Haskell', 'HTML', 'Java', 'JavaScript', 'Lisp', 'Perl', 'PHP', 'PowerShell', 'Python', 'Ruby', 'Scala', 'Scheme', 'SQL', 'TeX', 'XML'];
var suggestions = [];
for (i=0;i<choices.length;i++)
if (~choices[i].toLowerCase().indexOf(term)) suggestions.push(choices[i]);
suggest(suggestions);
}
});
})
远程获取数据
1、term 为 文本框输入的内容
2、q为$_GET参数
3、这里回调的data已经通过JSON.parse处理过可以直接使用了
$('#exampleInputAmount').autoComplete({
minChars: 1,
source: function(term, suggest)
{
term = term.toLowerCase();
$.getJSON('?type=autoComplete', { q:term }, function(data){
//console.log(JSON.stringify(data));
console.log(data);
});
}
});
jquery autoComplete 插件的更多相关文章
- jquery autocomplete插件
jquery autocomplete插件 https://goodies.pixabay.com/jquery/auto-complete/demo.html autocomplete-table ...
- Jquery autocomplete 插件示例
通过Jquery autocomplete 插件动态传递输入参数完成自动完成提示: <%@ page language="java" import="java.ut ...
- Jquery autocomplete插件的使用
简单用法: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnc ...
- PHP结合jQuery.autocomplete插件实现输入自动完成提示的功能
XHTML 首先将jquery库和相关ui插件,以及css导入.一共引用三个 jquery ,jquery_ui.js,jquery-ui.css 三个文件,不同版本小哥可能稍有差异(最后注意ajax ...
- Jquery autocomplete 插件使用
轻松实现类似百度输入框联想功能: autocomplete 是一个很厉害的插件,该插件基于jquery,在jquery官网能下载到最新版本. 首先,jQuery UI 是基于 jQuery 的,所以, ...
- jquery autocomplete 插件的使用
Autocomplete 自动完成 功能:输入框在输入关键字后,根据输入的内容给出相关的下拉框供用户选择,自动完成输入内容. 插件:使用jqueryUI的自动完成小部件,文档地址:https://jq ...
- jquery autocomplete插件结合ajax使用
<%@ page isELIgnored="false"%> <%@ page contentType="text/html; charset=UTF- ...
- 使用jQuery Autocomplete(自动完成)插件
jQuery 的Autocomplete(自动完成.自动填充)插件有不少,但比较下来我感觉,还是bassistance.de 的比较强大,我们就来写一些代码感受一下. 最简单的Autocomplete ...
- [Jquery] Jquery AutoComplete的使用方法实例
jQuery的Autocomplete(自动完成.自动填充)插件 jquery-autocomplete配置: <script type="text/javascript" ...
随机推荐
- Android -- 保存文件
背景 我们以常见 ...
- DateNavigator
<Border BorderThickness="1,1,1,1" BorderBrush="Black" Grid.Column="1&quo ...
- Oracle 错误收集
Oracle 错误大全 ORA-00001: 违反唯一约束条件 (.)ORA-00017: 请求会话以设置跟踪事件ORA-00018: 超出最大会话数ORA-00019: 超出最大会话许可数ORA-0 ...
- [Javascript] Funciton Expression
//This will load the code into the memory no matter //you call it or not function diffOfSquares(a,b) ...
- Platinum UPnP
http://www.plutinosoft.com/platinum http://blog.csdn.net/lancees/article/details/9178385 Note that P ...
- Chrome 对于 glyphicon 字体图标不显示的解决的方法
在将Chome默认字体渲染为微软雅黑后,部分字体图标显示为方框,这里Chome扩展文档提供的解决的方法为: 找到 custom.css 文件,路径为: C:\Users\(username)\App ...
- OpenCV 视频处理框架
OpenCV 本身集成了 FFmpeg,因此对于视频是有解码和编码功能的.尽管其效率在本人看来还不能跟未被封装的FFmpeg相提并论,然用其来对视频进行解码得到图像,然后对图像进行处理并将得到的图像又 ...
- STL 源代码剖析 算法 stl_algo.h -- partial_sort / partial_sort_copy
本文为senlie原创,转载请保留此地址:http://blog.csdn.net/zhengsenlie partial_sort / partial_sort_copy ------------- ...
- HTTP请求响应码
① 客户方错误 100 继续 101 交换协议 ② 成功 200 OK 201 已创建 202 接收 203 非认证信息 204 无内容 205 重置内容 206 部分内容 ③ 重定向 300 多路选 ...
- log4j 日志 配置 学习
1.用的flume-log4j avrosource的整合 2.学习如何指定类打印日志 #log4j.rootLogger=INFO,flume 这个是将全部的日志会打印出来 log4j.logge ...