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" ...
随机推荐
- 【Storm】学习笔记
Storm 1 基本概念 1.1 分布式.可扩展.高容错.实时流处理.跨语言 1.2 应用场景 1.2.1 实时分析 1.2.2 在线机器学习 1.2.3 分布式RPC 1.2.4 ETL数据抽取 1 ...
- [Algorithm] Tower Hopper Problem
By given an array of number, each number indicate the number of step you can move to next index: For ...
- Oracle查询client编码集
Oracle查询client编码集 SQL> select userenv('language') from dual; USERENV('LANGUAGE') ---------------- ...
- C语言及程序设计[套餐]课程主页
课程链接:http://edu.csdn.net/combo/detail/30,提供全部的视频和课件下载. 三部分的课程主页.提供了为每一课时配套的自測.演示样例下载,以及程序阅读.程序填空.实践项 ...
- Java 吸血鬼数字
非常羞愧(事实上没什么羞愧.水平就这样).搞了半晌才写出来了一个Java 版求四位吸血鬼数字的方法 吸血鬼数字是指位数为偶数的数字.能够由一对数字相乘而得到.而这对数字各包括乘积的一半位数的数字,当中 ...
- Eclipse 之使用技巧积累(一)
1.代码缩进 选中缩进代码,然后点击“Tab”键增加缩进. 2.代码退格 选中退格代码,然后按住“Shift”键,再点击“Tab”键退格. 3.无格式代码格式化 (1)默认快捷键:Ctrl + Shi ...
- mkdir命令(转)
原文:http://www.cnblogs.com/peida/archive/2012/10/25/2738271.html linux mkdir 命令用来创建指定的名称的目录,要求创建目录的用户 ...
- Oracle体系结构三(学习笔记)
- 前端框架(二)DIV多选复选框框的封装和MySql数据库存取
图能够包括的寓意和含义是文字不能比拟的,先有一个效果图你也就知道这篇文章的主要内容是关于什么问题的.省去了一大堆文字的累述.看以下这张图: watermark/2/text/aHR0cDovL2Jsb ...
- js输出指定n位数的随机数的随机整数方法【转发】
/** * Description:[输出指定n位数的随机数的随机整数] * * @param n 指定n位数 * */ function RndNum(n) { var rnd = "&q ...