jQuery插件之Ajax自动完成
平时用百度,谷歌搜索的时候,会有一个下,拉列表进行提示,这是一个非常好的功能。本文要介绍的这个JQuery 插件名叫Ajax Autocomplete 顾名思义,ajax 也就是用ajax的方式获取搜索提示信息然后返回呈现出来,上效果图
闲话不多说直接上代码
本文使用到的文件有:
1,点击 Ajax Autocomplete for jQuery, version 1.1.3 下载
引用文件:
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery.autocomplete.js"></script>
使用方法:
定义一个id 为query的文本框
<input type="text" name="query" id="query" />
刚才提到 'QueryServices.ashx' 这个文件 这就是后台处理数据的文件
因为这个插件要求返回结果必须是一个JSON对象 这个JSON对象的格式是这样的
{ query:'Li', //前台输入的查询内容 suggestions:['Liberia','Libyan Arab Jamahiriya','Liechtenstein','Lithuania'],//这里就是下拉框里显示的数据了 和下面的data是对应的 属于一键一值 data:['LR','LY','LI','LT']//这里和suggestions对应 作为suggestions的键 }
suggestions 对应前台 onAutocompleteSelect =function(value, data) 回调函数的 value 而
data 顾名思义 对应data
插件介绍到此为止 数据传送格式已和大家 列出大家可根据自己所用语言自行序列化。
原文链接:http://www.cnblogs.com/maxiao/archive/2012/04/25/2470712.html
相关推荐
TONIYH 2020-07-22
83510998 2020-07-18
wcqwcq 2020-06-26
delmarks 2020-06-14
ppsurcao 2020-06-14
tthappyer 2020-06-07
kentrl 2020-11-10
结束数据方法的参数,该如何定义?-- 集合为自定义实体类中的结合属性,有几个实体类,改变下标就行了。<input id="add" type="button" value="新增visitor&quo
ajaxyan 2020-11-09
zndy0 2020-11-03
学留痕 2020-09-20
Richardxx 2020-11-09
learningever 2020-09-19
chongxiaocheng 2020-08-16
ajaxhe 2020-08-16
lyqdanang 2020-08-16
curiousL 2020-08-03