GBin1插件推荐之马可波罗(Marco Polo),jQuery的自动补齐插件 - Autocomplete Plugin
让我们Google一下"jQuery autocomplete plugin"(jquery自动补齐插件)。在过去的4年中,我已经Google了很多次这个组合了。然而结果并没有变化多少。这里有很多的选择,但是没有哪一个让我能够很有信心的去应用到产品程序中。
说实话对于选择jQuery插件来说我很挑剔。如果我的用户对于插件有问题的话,那么我就得自己处理。我其实不想担心太多的第三方代码,因此我自己开发了一个jQuery使用准则用来衡量需要考虑的一些问题。没有特别的顺序:插件必须有很好的文档和注释,过去6个月内有维护和更新,很少有问题,遵循现代jQuery编码规范,非常灵活,能满足我80%的需要,没有大量我不使用的功能。没有任何一个自动补齐的插件满足上面的准则。
马可波罗(Marco Polo)
因此我决定自己编写一个。 了解一下马可波罗(Marco Polo),一个为独具慧眼的开发人员准备的jQuery自动补齐插件。我认为你会喜欢它,特别是如果你也使用我的方法来选择jQuery插件的话。但是,不要仅仅听我说,你最好自己试试演示,看看文档,自己使用插件执行一下你自己的系统。这里有一个快速帮助来解释如何使用这个插件。
开始
开始先包含jQuery和马可波罗到你的HTML:
<script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.marcopolo.min.js"></script>
下一步,添加输入框:
<input type="text" name="userSearch" id="userSearch" />
然后,将插件关联到输入框
$('#userSearch').marcoPolo({ url: '/users/search', formatItem: function (data, $item) { return data.first_name + ' ' + data.last_name; }, onSelect: function (data, $item) { window.location = data.profile_url; } });
当搜索开始时,一个GET请求url将会通过q(搜索关键字)添加到查询字符串中。我们使用Butler来查询。一个GET请求将创建到/users/search?q=Butler。你的后台程序必须使用q参数来查找和返回JSON数据格式得用户,如下:
[ { first_name: 'James', last_name: 'Butler', profile_url: '/users/78749', … }, { first_name: 'Win', last_name: 'Butler', profile_url: '/users/41480', … }, … ]
每一个JSON用户对象将传送到formatItem的回调选项中用来显示结果列表。当一个用户被选择到的时候,他们的JSON对象就会传送到onSelect回调选项中完成浏览器重定向。
很简单吧!这个例子演示了一部分基本的概念,潜在的夸张可以更加丰富。自己尝试一下,我认为你会很惊奇马可波罗竟然如此的灵活。
Manifest
Manifest是一个添加更多惊喜到多选输入的插件。Email地址中的接受字段是一个非常好的例子。你可以只简单提供一般文本输入,要求用户使用分号手工分开每一个收件人。 但是移除收件人是一个费劲的事情,但是使用这个插件,你知道用户会非常高兴这种用户操作体验的。
原文来自: GBin1插件之马可波罗(Marco Polo),jQuery的自动补齐插件 - Autocomplete Plugin
GBin1插件推荐之马可波罗(Marco Polo),jQuery的自动补齐插件 - Autocomplete Plugin的更多相关文章
- CentOS 7下的Vim自动补齐插件YouCompleteMe安装及配置
备注:现在对于 YouCompleteMe 的安装应采用更为简单的方法,即利用 Vundle 来安装这个插件.具体方法可见: Vundle 主页 YouCompleteMe 主页 而 .vimrc 的 ...
- vim里添加自动补齐插件,与python 函数补齐
参考 http://www.jb51.net/article/58009.htm 将 # cat ~/.vimrc filetype plugin on let g:pydiction_locati ...
- jupyter notebook 代码自动补齐插件
安装: . pip install jupyter_contrib_nbextensions -i https://pypi.mirrors.ustc.edu.cn/simple 2. jupyter ...
- VIM自动补全插件 - YouCompleteMe--"大神级vim补全插件"
VIM自动补全插件 - YouCompleteMe 序言 vim 之所以被称为编辑器之神多半归功于其丰富的可DIY的灵活插件功能,( 例如vim下的这款神级般的代码补全插件YouCompleteMe) ...
- Vimer的福音 新时代的Vim C++自动补全插件 clang_complete
使用vim的各位肯定尝试过各种各样的自动补全插件,比如说大名鼎鼎的 OmniCppComplete .这一类的插件都是对 Ctags 生成的符号表进行字符串匹配来获得可能的补全项.他们在编写 C 代码 ...
- 新时代的Vim C++自动补全插件 clang_complete
Vimer的福音 新时代的Vim C++自动补全插件 clang_complete 使用vim的各位肯定尝试过各种各样的自动补全插件,比如说大名鼎鼎的 OmniCppComplete .这一类的插 ...
- 【转】Vim自动补全插件----YouCompleteMe安装与配置
原文网址:http://www.cnblogs.com/zhongcq/p/3630047.html 使用Vim编写程序少不了使用自动补全插件,在Linux下有没有类似VS中的Visual Assis ...
- Vim自动补全插件----YouCompleteMe安装与配置
Vim自动补全插件----YouCompleteMe安装与配置 使用Vim编写程序少不了使用自动补全插件,在Linux下有没有类似VS中的Visual Assist X这么方便快捷的补全插件呢?以前用 ...
- vim python自动补全插件:pydiction
vim python自动补全插件:pydiction 可以实现下面python代码的自动补全: 1.简单python关键词补全 2.python 函数补全带括号 3.python 模块补全 4.pyt ...
随机推荐
- sqlServer将多字段设为主键方法
补充一下关于数据库多字段复合主键的设置. 首先一个表是不能有多个主键的.但是可以有多个字段组合成一个主键,这就是为什么有时候表里为什么会有多个字段都有主键的标志,那是因为他们组合成了一个主键了.我们可 ...
- 用nginx图片缓存服务器
图片的存储硬件 把图片存储到什么介质上? 如果有足够的资金购买专用的图片服务器硬件或者 NAS 设备,那么简单的很: 如果上述条件不具备,只想在普通的硬盘上存储,首先还是要考虑一下物理硬盘的实际处理能 ...
- Java的JDBC事务详解(转)
事务的特性: 1) 原子性(atomicity):事务是数据库的逻辑工作单位,而且是必须是原子工作单位,对于其数据修改,要么全部执行,要么全部不执行. 2) 一致性(consistency):事务在完 ...
- IntelliJ插件安装
1. 插件管理器在线安装 在IntelliJ插件管理页面([FileàSettingsàIDE SettingsàPlugins]),点击[Browse repositories-]按钮,在搜索框内输 ...
- mysql免安装版使用
打开命令行,到bin目录下,输入net start mysql 启动服务,输入mysql -u root -p回车后输入密码,进入mysql.
- 一个js 变量作用域问题
一个js 域问题,有一本书 叫 javasrcip pattert 好像是,写的很好,, <!DOCTYPE html> <html> <head lang=" ...
- JS 时间格式化函数
//时间格式化函数 Date.prototype.format = function (format) { var o = { "M+": this.getMonth() + 1, ...
- CSS自动控制图片大小的代码
img { max-width: 800px; height: auto; } 代码中的max-width:800px限制图片的最大宽度为800像素,而下面的hight:auto很关键,可以保证图片有 ...
- C# Java DES加密解密
转自http://www.cnblogs.com/zhuiyi/archive/2013/04/01/2993201.html 最近被DES加解密弄得超级郁闷,我用C#的方法加密得到的密文老是跟客户给 ...
- [C# 基础知识系列]专题四:事件揭秘
转自http://www.cnblogs.com/zhili/archive/2012/10/27/Event.html 引言: 前面几个专题对委托进行了详细的介绍的,然后我们在编写代码过程中经常会听 ...