一个基于jquey的自动完成与分页
这是最近做搜索引擎写的前台页面,全基于JQuery的ajax完成,包括自动完成和自动分页 。数据交换使用的是json格式。
JS
1 /**
2 * @author hyjiacan
3 */
4 $(document).ready(function() {
5 // 页面载入后焦点定位到搜索框中
6 $('#keyword').trigger('focus');
7 // 消除按钮点击时的虚线框
8 $('#submit').focus(function() {
9 $(this).trigger('blur');
10 });
11 // 返回当前浏览器名称
12 var getBrowserName = function() {
13 var bmap = new Array();
14 $.each($.browser,
15 function(k, v) {
16 bmap.push(k);
17 });
18 return bmap[0];
19 };
20 // ajax获取下拉列表
21 var $autocompletelist = $('<div/>');
22 $autocompletelist.addClass('autocompletelist');
23
24 // 自动完成事件处理
25 var lastVal = '';
26 $('#keyword').keydown(function(e) {
27 // 将回车默认提交更改为ajax提交
28 if (e.keyCode == 13) {
29 hideAutoComplete();
30 $('#submit').trigger('click');
31 return false;
32 }
33 });
34 var hideAutoComplete = function() {
35 // 移除自动完成下拉列表
36 $('#container').remove($autocompletelist);
37 $autocompletelist.empty();
38 $autocompletelist.slideUp(100);
39 };
40 $('#keyword').attr('onpaste', function(){
相关新闻>>
- 发表评论
-
- 最新评论 更多>>