小试JQuery的AutoComplete插件


Posted in Javascript onMay 04, 2011

前台代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>JQuery的自动完成功能</title> 
<script src="jquery.autocomplete/jquery-autocomplete/lib/jquery.js" type="text/javascript"></script> 
<script src="jquery.autocomplete/jquery-autocomplete/jquery.autocomplete.min.js" type="text/javascript"></script> 
<link href="jquery.autocomplete/jquery-autocomplete/jquery.autocomplete.css" rel="stylesheet" type="text/css" /> 
<script src="jquery.autocomplete/jquery-autocomplete/demo/localdata.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
raiseEvent(); 
}); 
//请求完成,被回调的函数 
function rServer(arg, context) { 
eval(arg); 
$("#sugest").focus().autocomplete(data); 
} 
//向服务器端发起数据处理请求 
function raiseEvent(arg, context) 
{ 
<%=ClientScript.GetCallbackEventReference(this,"arg","rServer","context") %>; 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="text" name="text" id="sugest" style="width:200px" /> 
</div> 
</form> 
</body> 
</html>

然后就是后台代码,当然了,这里只是模拟数据:
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Text; 
public partial class _Default : System.Web.UI.Page,ICallbackEventHandler 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
if (!IsPostBack) 
{ 
} 
} 
private StringBuilder GenStr() 
{ 
StringBuilder sbStr = new StringBuilder(); 
sbStr.Append("var data = "); 
sbStr.Append("["); 
sbStr.Append("\"Aback\","); 
sbStr.Append("\"back\","); 
sbStr.Append("\"cback\","); 
sbStr.Append("\"english\","); 
sbStr.Append("\"confidence\","); 
sbStr.Append("\"diligent\","); 
sbStr.Append("\"honor\","); 
sbStr.Append("\"delicious\""); 
sbStr.Append("];"); 
return sbStr; 
} 
public string GetCallbackResult() 
{ 
return GenStr().ToString(); 
} 
public void RaiseCallbackEvent(string eventArgument) 
{ 
} 
}
Javascript 相关文章推荐
DWR Ext 加载数据
Mar 22 Javascript
JavaScript 基础知识 被自己遗忘的
Oct 15 Javascript
JS解析json数据并将json字符串转化为数组的实现方法
Dec 25 Javascript
浅谈JQuery+ajax+jsonp 跨域访问
Jun 25 Javascript
js 声明数组和向数组中添加对象变量的简单实例
Jul 28 Javascript
JS库之wow.js使用方法
Sep 14 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
Sep 18 Javascript
详解JSON Web Token 入门教程
Jul 30 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
Dec 28 Javascript
使用异步controller与jQuery实现卷帘式分页
Jun 18 jQuery
v-slot和slot、slot-scope之间相互替换实例
Sep 04 Javascript
vue 实现基础组件的自动化全局注册
Dec 25 Vue.js
为你的网站增加亮点的9款jQuery插件推荐
May 03 #Javascript
通过jquery的$.getJSON做一个跨域ajax请求试验
May 03 #Javascript
Jquery 绑定时间实现代码
May 03 #Javascript
jqgrid 简单学习笔记
May 03 #Javascript
用js实现判断当前网址的来路如果不是指定的来路就跳转到指定页面
May 02 #Javascript
jQuery之网页换肤实现代码
Apr 30 #Javascript
HTML5附件拖拽上传drop &amp; google.gears实现代码
Apr 28 #Javascript
You might like
PHP生成静态页面详解
2006/12/05 PHP
php 自写函数代码 获取关键字 去超链接
2010/02/08 PHP
php版微信公众平台回复中文出现乱码问题的解决方法
2016/09/22 PHP
关于Curl在Swoole协程中的解决方案详析
2019/09/12 PHP
yii2.0框架实现上传excel文件后导入到数据库的方法示例
2020/04/13 PHP
JavaScript Accessor实现说明
2010/12/06 Javascript
基于JQuery的Select选择框的华丽变身
2011/08/23 Javascript
js实时获取系统当前时间实例代码
2013/06/28 Javascript
每天一篇javascript学习小结(RegExp对象)
2015/11/17 Javascript
基于javascript实现图片左右切换效果
2016/01/25 Javascript
BootStrap使用popover插件实现鼠标经过显示并保持显示框
2016/06/23 Javascript
Nodejs下DNS缓存问题浅析
2016/11/16 NodeJs
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
jquery 禁止鼠标右键并监听右键事件
2017/04/27 jQuery
angularjs 的数据绑定实现原理
2018/07/02 Javascript
React Native基础入门之调试React Native应用的一小步
2018/07/02 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
2018/08/09 Javascript
Angular6封装http请求的步骤详解
2018/08/13 Javascript
vue项目出现页面空白的解决方案
2019/10/31 Javascript
antd的select下拉框因为数据量太大造成卡顿的解决方式
2020/10/31 Javascript
跟老齐学Python之dict()的操作方法
2014/09/24 Python
零基础写python爬虫之神器正则表达式
2014/11/06 Python
Python使用Selenium爬取淘宝异步加载的数据方法
2018/12/17 Python
Python爬虫 scrapy框架爬取某招聘网存入mongodb解析
2019/07/31 Python
python爬取Ajax动态加载网页过程解析
2019/09/05 Python
Django ModelForm操作及验证方式
2020/03/30 Python
keras实现theano和tensorflow训练的模型相互转换
2020/06/19 Python
Python监听剪切板实现方法代码实例
2020/11/11 Python
瑞典领先的汽车零部件网上零售商:bildelaronline24.se
2017/01/12 全球购物
C有"按引用传递"吗
2016/09/06 面试题
大学生军训自我鉴定
2014/02/12 职场文书
《中华少年》教学反思
2014/02/15 职场文书
青年安全生产示范岗事迹材料
2014/05/04 职场文书
行为规范主题班会
2015/08/13 职场文书
小学语文国培研修日志
2015/11/13 职场文书
python manim实现排序算法动画示例
2022/08/14 Python