JQuery UI Autocomplete与jquery.autocomplete.js
程序中要把一个select改成可以下拉搜索的,就想到了使用下autocomplete.js大概是这么个东西。
问了下同学,推荐我使用Jquery Ui autocomplete,下载下来开始调试使用,终于调好了,但是发现输入字符后无反应。
就完全按照官网实例,写了个数据源发现没问题,然后就感觉应该是数据源的问题,后来想到到源码中找一下,看看插件到底是怎么使用数据源的,找了一会没找到。
很郁闷不知道什么问题,然后就又问了下同学,给我发了一段代码,发现我们两个用的不一样,
function parse(data) { var parsed = []; var rows = data.split("\n"); for (var i = 0; i < rows.length; i++) { var row = $.trim(rows[i]); if (row) { row = row.split("|"); parsed[parsed.length] = { data: row, value: row[0], result: options.formatResult && options.formatResult(row, row[0]) || row[0] }; } } return parsed; };$.extend( $.ui.autocomplete, {
escapeRegex: function( value ) {
return value.replace( /[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&" );
},
filter: function( array, term ) {
var matcher = new RegExp( $.ui.autocomplete.escapeRegex( term ), "i" );
return $.grep( array, function( value ) {
return matcher.test( value.label || value.value || value );
} );
}
} );
原来这个这个匹配的地方,使用的属性数据源里面的字段名必须与官网的实例一致。“matcher.test( value.label || value.value || value );”
然后就修改下数据源,然后可以使用了。
但是,写完了,我同学说JQuery UI 的autocomplete是个阉割版,完整版名字叫:jquery.autocomplete.js
一搜索果然是啊,这个版本比jQuery UI的强大很多啊,功能也特别全。害我已经调了那么久了,其实以前用过这个版本,但是一直感觉不正规,就想找个官网可以下载的。
后来发现我在csdn下载过,我以前用的都是这个完整版本,不是阉割版。
JQuery UI 的 autocomplete对jQuery版本还有要求,最后还要写点代码,让两个jQuery版本可以在一个页面出现。
这个详情请百度。
var $jq = jQuery.noConflict(true); 新版本使用完后调用。
大概意思是调用这句话,让$回复成被覆盖的版本。
JQuery UI Autocomplete与jquery.autocomplete.js的更多相关文章
- jQuery UI 实例 - 自动完成(Autocomplete)
http://www.runoob.com/jqueryui/example-autocomplete.html 自定义数据并显示 您可以使用自定义数据格式,并通过简单地重载默认的聚焦和选择行为来显示 ...
- Jquery UI
jQuery UI简介 jQuery UI包含了许多维持状态的小部件(Widget),因此,它与典型的 jQuery 插件使用模式略有不同.所有的 jQuery UI 小部件(Widget)使用相同的 ...
- jQuery UI简单的讲解
我们先进入一下问答时间,你都知道多少呢? (1)什么是jQuery UI 呢? 解答:jQuery UI 是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互. ...
- jquery ui的css设计
jquery ui 是当前最强大的UI库之一,其两大卖点是对IE6的良好支持与换肤功能.为了构建avalon ui,今天起我将投入一部分精力来研究时下最流行的几个CSS框架.它是首当其冲. jquer ...
- JQUERY插件学习之jQuery UI
jQuery UI:http://jqueryui.com/ jQuery UI介绍: jQuery UI 是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库.包含底层用户交互 ...
- jquery ui 怎么实现tab标签切换效果
1.效果图 2.HTML 代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> &l ...
- 1分钟看完 jQuery UI
jQuery UI简介 jQuery UI包含了许多维持状态的小部件(Widget),因此,它与典型的 jQuery 插件使用模式略有不同.所有的 jQuery UI 小部件(Widget)使用相同的 ...
- 使用requireJS的shim参数 解决插件 jquery.ui 等插件问题
没有requireJS框架之前,如果我们想使用jquery框架,会在HTML页面中通过<script>标签加载, 这个时候jquery框架生成全局变量$和jQuery等全局变量.如果项目中 ...
- JavaScript UI选型及Jquery EasyUI使用经验谈
最近由于项目需要,对js UI作了一些简单的了解和使用,有自己的一些想法,在这里留个记录. 当然,我的专注点在管理系统的范围内,所以互联网网站及其他形态的应用这里不提及,所以jQuery UI和Boo ...
- 关于ExtJS、JQuery UI和easy UI的选择问题
转自百度知道. 问:做企业级应用,比如***管理系统,不需要华丽的特效,只希望简单,风格统一.能用到的只有messagebox.tree.grid大概这几个,其他特效不要,忘大神根据自己的见解以及我这 ...
随机推荐
- java io流 创建文件、写入数据、设置输出位置
java io流 创建文件 写入数据 改变system.out.print的输出位置 //创建文件 //写入数据 //改变system.out.print的输出位置 import java.io.*; ...
- Key-Value-Coding(KVC)
Objective-C语法之KVC的使用 除了一般的赋值和取值的方法,我们还可以用Key-Value-Coding(KVC)键值编码来访问你要存取的类的属性. 下图来自苹果官网: 如何使用KVC存 ...
- TCP/IP协议学习笔记
计算机网络基础知识复习汇总:计算机网络基础知识复习 HTTP协议的解析:剖析 HTTP 协议 一个系列的解析文章: TCP/IP详解学习笔记(1)-- 概述 TCP/IP详解学习笔记(2)-- 数据链 ...
- String 及其数组的相关问题
由其他类型转String一般用三种方法 方法1:采用 Object.toString()方法 请看下面的例子: Object object = getObject(); System.out.prin ...
- webview中的页面兼容iphone6和6+
其实写这篇文章的本不该是我,而应该是开发ios的小伙伴,但作为一个前端,我想我还是有必要做一下记录的! 首先我想说下在iphone6或者6+中webview内嵌套的页面宽度已经不在是320px,而是3 ...
- 安装和使用memcached
引用:http://www.czhphp.com/archives/252 如何将 memcached 融入到您的环境中? 在开始安装和使用 using memcached 之前,我们需要了解如何将 ...
- 常用vim设置
set tabstop=4set shiftwidth=4set expandtabset hlsearchset cindent set autoindent set tabstop=4是设TAB宽 ...
- android 多线程 示例
public class MyRun implements Runnable { int count = 1000; @Override public void run() { while (true ...
- 给pcm格式文件加wav文件头
#include <stdlib.h>#include <stdio.h>#include <string.h>void main(){ //wav头的结构如下所示 ...
- Android-ConvenientBanner轻松实现广告头效果
Android-ConvenientBanner通用的广告栏控件,让你轻松实现广告头效果.支持无限循环, 可以设置自动翻页和时间(而且非常智能,手指触碰则暂停翻页,离开自动开始翻页. 你也可以设置在界 ...