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" ...
随机推荐
- .NET-WEB网站部署的过程中需要注意的问题
--部署的网站的文件夹需要有IIS_USER权限(写权限) --部署的网站在外网不能访问:一般是由于防火墙的限制导致的.配置防火墙就可以.
- [Angular] Use ngx-build-plus to compile Angular Elements
We can treat Angular Element as each standlone lib and compile each Angular element spreatly. Tool w ...
- 【Nodejs】nimble或async并不能保证程序串行执行,回调是回避不了的坑
先看一段例程: //------------------------------- // 用于创建目录 //------------------------------- function creat ...
- css选择器顺序的小技巧
在线演示 本地下载 css的选择器的顺序其实很有意思,如果应用的好的话,可以做一些简单的逻辑出来,配合上css3,就可以尽可能的脱离js了. 这里的演示是一个带有hover事件的四张照片,效果来自一个 ...
- 如何使用Ultraiso制作U盘启动盘
准备好可启动的ISO文件和足够容量的U盘.点击工具-写入硬盘镜像. 各种U盘启动模式简介 1.USB-HDD:硬盘仿真模式,DOS启动后显示C:盘,HP U盘格式化工具制作的U盘即采用此启动模式.此模 ...
- ZH奶酪:Ubuntu14.04 安装Android SDK(SDK tools only)
1.安装JDK(我安装的是Oracle的,而不是openjdk) jdk目录:usr/lib/jvm/java-7-oracle/bin/java 2.下载Android-SDK,在下边的网页选择对应 ...
- Linux获得命令帮助(学习笔记五)
一.获得命令帮助 1.1.内部命令与外部命令 简单来说,在linux系统中有存储位置的命令为外部命令: 没有存储位置的为内部命令,可以理解为内部命令嵌入在linux的shell中,所以看不到. typ ...
- 为什么学习Python及Python环境安装
大部分人在工作中可能是以c/c++.java之类的语言为主.这也可能是我们接触的第一个开发语言,这类语言一般有丰富地类库.高效地运行速率.灵活地组合控制,须要经过编译在运行.适用于大型的项目proje ...
- UITextField限制输入中文字数
前面写一了篇,UITextField Category来限制输入的字数,是有个Bug的,要输入中文时会crash.如今改动 了下.代码例如以下 .h文件 #import <UIKit/UIKit ...
- ONVIFclient搜索设备获取rtsp地址开发笔记(精华篇)
概要: 眼下ONVIF协议家族设备已占领数字监控行业半壁江山以上.亲,作为开发人员的你还在犹豫是否了解下吗?本文介绍了ONVIFclient从设备搜索,鉴权,能力获取,媒体信息获取 ...