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);
        }
    });
})
时间: 2024-08-27 08:38:21

jquery autoComplete 插件的相关文章

Jquery autocomplete插件的使用

简单用法: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></ti

jquery.autocomplete 插件扩展滚动条加载更多

项目中用到autocomplete插件,但是插件的原有功能,不能满足项目全部需求所以修改了增加了以下几点功能: 1 粘贴文本自动加载数据 2 滚动条滚动到底部加载更多数据 3 与页面插件联动更新数据(清除缓存) 4 增加插件赋值给一个隐藏域,就可以得到文本和值 (做asp.net的用起来比较方便) 如果要启用滚动条加载更多数据 配置参数时加上 scroll:true, pagingMore:true 在加载更多时请求的url参数会有一个page的参数 它标识当前请求的是第几页数据 ps(这个分页

Jquery AutoComplete的使用方法实例

jquery.autocomplete详解 语法: autocomplete(urlor data, [options] ) 参数: url or data:数组或者url [options]:可选项,选项解释如下: 1) minChars (Number) 在触发autoComplete前用户至少需要输入的字符数,Default:1,如果设为0,在输入框内双击或者删除输入框内内容时显示列表. 2) width (Number) 指定下拉框的宽度,Default: input元素的宽度 3) m

jQuery Autocomplete 自动补全功能

使用Autocomplete可以很简单的就有文本框的自动补全功能提示了. 在HTML文件中引入autocomplete的js文件和css样式文件,以及autocomplete压缩包中的jQuery的js文件,不要私自用高版本的jQuery,可能会导致显示不出效果. 先来从网友那里拷贝过来的最简单的例子: <span style="font-size:24px;"><!DOCTYPE html> <html> <head> <meta

一场由股票提醒助手插件引发的血案——浅入浅出 jquery autocomplete

我没有学过前端,所以这篇文章注定要班门弄斧了. 通常,需要用到什么技术什么语言时,我才去学,学了也不一定掌握,就是记不住!所以现在明白了,学习的时候,亦或是攻克难点的时候,一定要记录下来,并不一定非要呈现什么高大上的技术,但求复原自己的心路历程足以. 大家都知道,最近股市很火爆,当然这几天正在调整期呵呵,神车复牌都交出一天涨停一天跌停的答卷自降为灵车,相比于528垂直过山车,见怪不怪了.很多人虽然没投入大量精力炒股,但还是时刻关注着股市行情,上班族们总不能时刻盯着手机看吧,所以我就想到了股票插件

JQuery 的Autocomplete插件 result

工作当中用到了JQuery 的Autocomplete插件,但是遇到的是非常规使用的问题. 其一是下拉菜单的显示和填入文本框的结果要求的字符串不一样,即显示用户名,所属部门,但是填入文本框里的是用户名和电话号码 其二是在用户Select过后,需要触发事件,把用户的ID传到另一个隐藏的文本框中 首先咱比较懒,于是在网上google了一下技术方案,发现都比较复杂.出于想偷懒的目的,研究了Autocomplete的在线DOC以后,发现有很简单的解决方案 首先是应用Autocomplete的format

jquery.autocomplete.js 插件的自定义搜索规则

这二天开始用jquery.autocomplete这个自动完成插件.功能基本比较强大,但自己在实际需求中发现还是有一处不足!问题是这样:当我定义了一个本地数据JS文件时,格式为JSON式的数组.如下: var stockInfoJson = [ { name: "深发展A", code: "000001",spell:"sfza" }, { name: "万科A", code: "000002",spell

jquery.autocomplete联想补全插件及使用中遇到的问题

一.jquery.autocomplete.js插件的使用 插件的使用可参考以下这篇文章,里面也有很详细的参数说明:https://www.cnblogs.com/guo0/archive/2012/01/10/2318140.html 二.在使用该插件时遇到的问题: 1.第一次点击输入框不会出现下拉框,要点击两次或者按回退键才行.改成单击时触发的方法为: 将插件源码中的 if ( hasFocus++ > 1 && !select.visible() ) { onChange(0,

jquery autocomplete 自动补全

写在前面 autocomplete是jqueryUI里的一个插件 效果和说明可以访问这里,作用类似于搜索时的自动提示: 相信用过jQuery autocomplete 自动补全功能同学有不少,但是往往我们所对应的需求不同,有的仅仅是为了省事,敲两个字就有一堆可供选择的信息可供选择,但并不是所有需求都是这样的,我们还有这样的需求,敲两个字,将这个文字对应的实体绑定出来. 主要的参数 jQuery UI Autocomplete常用的参数有: Source:用于指定数据来源,类型为String.Ar