点此下载
插件简介:
英文说明:http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry/
类似google搜索的自动完成的功能,但UI有所增强。内含二个皮肤,其中个人比较推崇facebook的那个样式。大家可以看截图和演示
目前这个插件完美支持英文,但在中文输入的有bug,就是你输入完中文后,退删除一个字符,才会触发ajax事件。之前有好几个朋友向我询问解决方案。
现在已经解决这一个问题,其实只要把keydown换为keyup即可。中文示例与修改后的源代码请看压缩包
插件使用说明:
第一步:引进JQ库和插件JS文件,还有CSS文件
<script src="/admin/blogs/jquery-1.3.2.min.js" type="text/javascript"></script><script src="/admin/blogs/jquery.tokeninput.js" type="text/javascript"></script>
其中的token-input-facebook.css,就是我所说的facebook样式。
第二步:初始化插件
$("#tokenize").tokenInput("./test.php", {
hintText: "Type in the names of your favorite TV shows",
noResultsText: "No results",
searchingText: "Searching..."
});
第三步:服务器端编程(这里使用php)
关键点说明:插件会向服务器端传输查询字段q,使用的是get方法。所以服务器端通过截取q值,来提取数据库的数据,php中:
$_GET['q']。最后返回的必须是json数据结构:
[{"id":"856","name":"House"},
{"id":"1035","name":"Desperate Housewives"},
{"id":"1048","name":"Dollhouse"},
{"id":"1113","name":"Full House"}
]
原文连接:http://www.36ria.com/129
分享到:
相关推荐
《jQuery标签输入自动完成插件jquery.tagsinput-revisited.js详解》 在Web开发中,用户交互体验至关重要,其中一种常见的需求就是实现输入框的自动完成功能,这能够提升用户的输入效率并提供良好的用户体验。jQuery...
综上所述,jQuery文本框联想补全自动完成插件提供了强大的功能,能够极大地提升网页输入体验。开发者可以根据项目需求灵活配置和扩展,实现个性化的自动补全效果。同时,结合`style.css`和`index.html`的示例,可以...
其中,"autocompleter"是jQuery UI中的一个关键功能,它实现了自动完成(Autocomplete)的功能,用于增强输入框的用户体验,提高数据输入的效率。自动完成插件在诸如搜索引擎、表单填充等场景下尤为常见。 该插件的...
jQuery自动完成插件是网页开发中常用的一种工具,它能够为用户提供实时的搜索建议,提升输入体验。在标题"jQuery自动完成插件autocomplete.zip"中,我们了解到这是一个基于jQuery库的插件,主要功能是实现自动完成...
本文将详细讲解如何使用基于jQuery的Tips插件,该插件允许提示框自动消失或由用户手动消失,从而为用户提供更加友好的交互体验。 首先,我们来了解jQuery Tips插件的基本概念。Tips插件主要用于在网页上显示临时...
jQuery时间自动完成插件是一种基于JavaScript库jQuery设计的交互式组件,主要用于提升用户在输入时间相关的数据时的体验。在Web应用中,特别是在预订、调度或时间管理等场景下,这种插件尤其有用,因为它可以帮助...
jQuery文本框联想补全自动完成插件,jQuery文本框联想补全自动完成插件,jQuery文本框联想补全自动完成插件,jQuery文本框联想补全自动完成插件,jQuery文本框联想补全自动完成插件,jQuery文本框联想补全自动完成...
jQuery自动完成插件是一种便捷的前端开发工具,它极大地提升了用户体验,特别是当用户需要在输入框中输入特定数据时。这款轻量级的jQuery插件设计精巧,旨在帮助用户快速找到并选择匹配的选项,从而减少手动输入的...
**jQuery自动提示插件在Eclipse中的安装与使用** 在Web开发中,jQuery是一个非常流行的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。为了提高开发效率,开发者通常会使用集成开发环境...
本篇文章将深入探讨一个名为“jQuery自动补全自动提示插件”的实现,它模仿了百度搜索的自动提示效果。 首先,我们要理解自动补全的核心原理。这个原理基于事件监听和AJAX异步请求。当用户在输入框中输入字符时,...
《jQuery自动完成输入插件——实现高效用户交互体验》 在网页开发中,提供便捷的用户输入体验至关重要,其中一种常见的方法就是使用自动完成输入功能。jQuery作为一个轻量级、功能丰富的JavaScript库,为开发者提供...
jQuery completer 是 jQuery 自动完成插件。在线演示 标签:jQuery
jQuery Autocomplete插件是jQuery UI库中的一个组件,它提供了搜索框自动补全的功能,极大地提高了用户输入数据的效率和用户体验。这个插件基于jQuery框架,使得在网页中实现智能搜索和建议输入变得简单易行。 ### ...
在网页开发中,jQuery自动完成插件是一种常见的交互功能,它为用户输入提供即时建议,提升用户体验。这些插件通常用于搜索框、表单输入等场景,帮助用户快速找到他们想要的信息或输入内容。本集合包含了多个优秀的...
我们在网页中发布文章的时候,经常会输入多个文章相关的标签,今天介绍的这个jQuery插件就可以帮助我们更方便地输入标签。当我们输入完标签文本后按回车或者焦点离开输入框时,输入的标签将会自动生成。同时你可以按...
针对“jquery邮箱地址自动完成插件”的主题,我们主要关注的是如何利用jQuery来实现一种功能,即在用户输入邮箱地址时提供实时的自动补全建议。 这个插件的设计目的是为了提高用户体验,当用户在网页表单中输入邮箱...
这里向大家推荐一款优秀的 jQuery 文本输入框自动完成 & 自动提示插件,帮助你在网站中轻松添加输入框的自动完成和自动提示功能。主要参数介绍: serviceUrl:Ajax 请求的 URL; lookup:本地数据数组; minChars:...
在Sublime Text 2中,安装jQuery自动完成插件可以为开发者提供实时的代码提示和自动补全功能,从而帮助他们更快地编写和理解jQuery代码。 安装该插件的过程相对简单。首先,你需要确保已经安装了Package Control,...
jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....