<!doctype html>

<html>

<head>

<meta name="content-type" content="text/html; charset=gbk">

<title>jQuery UI Autocomplete - 默认功能</title>

<link rel="stylesheet"

    href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

<script src="//code.jquery.com/jquery-1.10.2.js"></script>

<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<link rel="stylesheet" href="/resources/demos/style.css">

<script>

    $(function() {

        //这里 数据是数组的形式

        var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC",

                "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang",

                "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp",

                "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme","中国","国家" ];

        $("#tags").autocomplete({

            source : availableTags

        });

    });

</script>

</head>

<body>

    <div class="ui-widget">

        <label for="tags">检索: </label> <input id="tags">

    </div>

</body>

</html>

效果图:

　　aaarticlea/png;base64,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" alt="" />

　　aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUoAAABhCAIAAAA/V38TAAAE8klEQVR4nO3dPY7bOBiAYZ3FF+AxfAreQBdhpXskCERgy2yaXGAhQF2KCWaBBRKkSLvVbCF59EeJ9OfR6BP3fcDK0XgUA68oU/K4+PbzXwaDkeUoDt8DBoOx0yBvBiPbQd4MRraDvBmMbEfx4c+/GAxGlqN4AZAp8gayRd5AtsgbyBZ5A9kibyBb5A1ki7yBbJE3kK1z5/30/fnzl68fP/3BYCgcn798ffr+fGAg5877+e+fP379PnovgLAfv35/e/rnwB04fd5H7wKwhbzlHs+7KM79CkA58pYjbyhH3nLkDeXIW468odwJ8m7bNvCo9/7uXyf5mQ3RvMN7PkLe2NUZ8namKKwPPGhcJJ8Zb4vlM8lF847+PvLGrs6R96Lj1pnCOufuS9XbaWytM3cfIkbis3dgzyfIG7s6Z97eFsa1L60z63Nj60wR0T3HnceIAXlDuRPl3TrbtTKqJhrQxHz2ftA079fdGz+03Lv+yNQhb+xKb96L2dc474z1sym722xZrbehx5Ybts4sHvS2KBLepc/zjp4t3P4j1vd9kzd2pTfvm+kbZG8Ds3WfYzHZLnw27gKPW+umzynKO3DwCMze06MJeWNX+vMetbYy+y6D93a2rO5tUVh/u1I1HCO8C53akzfyoD5vb7tZuQ90MS0b126vjs2vq3VPaBZvlO9H3lBOe97eFsaYfpl81Mr4DpVb+eEfX56gP9x1j7yhnPK8vbV+EsnrjWDD0lnrjHE+doPY+C18twr2cOfSpTXyxjtRnXd3rWma9+jqWN9J9HLX7fx+/uThJfd0i7wDUzWzNw6kOO9bydNIXq+L3ULZqDu8fD6cpG+c1afgthYopzfv1vvgrSu3+0L6h6N3ro3+dXmNe+XjKqKV8+CvJ28cSG/er2aRrEzm64arZKMJf7Ne8kYezpH3amnDnaDr87BxbX8qMH2m9YjfKu/JDagh5I1dnSfvhJXpSY/jT2MOb8JnuQU/bJoq6QOhm09O3tjVefJO2bIdXfhKu7/tEQl5R/abvLGrE+StFn+MCcqRtxx5QznyliNvKEfecnxLCZQjbzm+Ywya8R1jD/kAnMFRgZw+76N3AYggbyHyhn7kLUTe0I+8hcgb+pG3EHlDP/IWIm/oR95C5A39yFuIvKEfeQvd/8I1TbPLngBryFvo/heuLi+XS1nHNmuq6yXRteKAgS3kLSSYvatrSo9pmyU+Gf7fyFvoqLzr8nIpa/JGCvIWirxwTVXO6wsVWZeLM+x+s7oMn5CX9ctLXVU1eSOOvIWieae+g76WdTP7yXm46wcBYAt5C8VeuLqcL6MFimyq62KxjbzxZshb6JC8m+rar5eTNxKQt9DueYdO77t/qOuGvJGCvIUOmL3H5+jkjQTkLfRmS2v3nJzX5WU4TSdvxJC3UDzvhNWwu5fWmurabU/eSEDeQu95W8vsrJzbWpCIvIX2zbuenNt3OQ+ra3VZVuSNOPIW4p5z6EfeQqJPjCXmLVyUA2bIW0j2gdCEIpNnb/JGDHkLSfJO6pG/+oA3Q95C/DEm6EfeQuQN/chbiLyhH3kLkTf0I28h8oZ+5C1E3tCPvIUe/1514B0cFci58wawgbyBbJE3kC3yBrJF3kC2yBvIFnkD2SJvIFvkDWSLvIFskTeQLfIGskXeQLbIG8gWeQPZIm8gW+QNZIu8gWz9B/mil3EqWix2AAAAAElFTkSuQmCC" alt="" />

参考:

　　http://jqueryui.com/autocomplete/

　　http://www.cnblogs.com/lwme/archive/2012/02/12/jquery-ui-autocomplete.html

主要是为了与solr搜索的自动提示功能 结合.

jQuery autocomplete -默认的更多相关文章

  1. [转]jQuery.Autocomplete实现自动完成功能（详解）

    本篇文章除了介绍jquery.autocomplete基本参数外,主要说明jquery.autocomplete的数据源的格式问题.     1.jquery.autocomplete参考地址 htt ...

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

    这二天开始用jquery.autocomplete这个自动完成插件.功能基本比较强大,但自己在实际需求中发现还是有一处不足!问题是这样:当我定义了一个本地数据JS文件时,格式为JSON式的数组.如下: ...

  3. jQuery.Autocomplete实现自动完成功能（详解）

    1.jquery.autocomplete参考地址 http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ http://do ...

  4. Jquery autocomplete插件的使用

    简单用法: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnc ...

  5. jquery.autocomplete自动补全功能

    项目实例: 一:js //SupplierAutoComplete.js $().ready(function () { $("#txtSupplier").autocomplet ...

  6. Jquery AutoComplete的使用方法实例

    jquery.autocomplete详解 语法: autocomplete(urlor data, [options] ) 参数: url or data:数组或者url [options]:可选项 ...

  7. jQuery.Autocomplete实现自动完成功能-搜索提示功能

    $(function(){ var availableTags=["ads","abc","acc"]; $("#tags&quo ...

  8. jQuery Autocomplete 备忘录

    之前使用过此 widget,如今再次需要,发现很多东西已经记不起来了,当然之前用的版本也不一样. 使用之前当然是先认真阅读官方的说明文档和示例,这点很重要,而不是东一块西一点的去网上瞎找资料.Opti ...

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

    我没有学过前端,所以这篇文章注定要班门弄斧了. 通常,须要用到什么技术什么语言时,我才去学,学了也不一定掌握,就是记不住!所以如今明确了.学习的时候,亦或是攻克难点的时候,一定要记录下来.并不一定非要 ...

随机推荐

  1. angularJS控制器之间的相互通信方式、$broadcast、$emit、$on

    在项目中,我们可能会很经常性的利用到控制器之间的相互通信,在angular中的控制器之间的相互通信有以下几种方式: 1)通过本地数据的存储localstorage,sessionstorage, 2) ...

  2. VS2010 无法启动程序，系统找不到指定的文件

    1>------ 已启动生成: 项目: work, 配置: Debug Win32 ------1>生成启动时间为 2018/1/9 14:01:16 下午.1>Initialize ...

  3. Firewalld中的whitelist并不是规则白名单

    原文地址:http://www.excelib.com/article/292/show whitelist的含义 白名单跟防火墙结合在一起大家很容易将其理解为规则白名单,不过在Firewalld中w ...

  4. 【JS】if...else 优化形式

    if () {} else {} —— 使用三元操作符/省略大括号{} if(foo){ funcA(); }else{ funcB(); } foo?funcA():funcB(); if(!foo ...

  5. java代码----I/O流写出整型，浮点型，

    总结: package com.a.b; import java.io.*; public class fdsf { public static void main(String[] args) th ...

  6. Joker的自动化之路

    系统篇     颜色 黄绿+金色 使用mac系统常用工具(包含svn,vim,crt,redis,php5,网络性能命令) 计算机硬件         linux发展史            cent ...

  7. 10 删除topic中的数据

    1 打开    server.properties2  添加一条:  delete.topic.enable=true 3  执行命令:   bin/kafka-topics.sh --delete ...

  8. 关于最大传输单元（MTU）的整理

    MTU设置不当,可能会导致许多网络问题,如某些网络应用无法使用,某些网站无法访问等.下面是在网上搜索整理的关于MTU设置的东西,某些可能未作验证,仅供参考. 1. 如何确定网络MTU 某些ISP接入的 ...

  9. 【洛谷】P1892 团伙（并查集）+ 求助

    题目描述 1920年的芝加哥,出现了一群强盗.如果两个强盗遇上了,那么他们要么是朋友,要么是敌人.而且有一点是肯定的,就是: 我朋友的朋友是我的朋友: 我敌人的敌人也是我的朋友. 两个强盗是同一团伙的 ...

  10. 前端性能优化：gzip压缩文件传输数据

    一.文件压缩的好处 前端生产环境中将js.css.图片等文件进行压缩的好处显而易见,通过减少数据传输量减小传输时间,节省服务器网络带宽,提高前端性能. 二.http协议如何支持压缩文件的传输 1.浏览 ...