小试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 相关文章推荐
IE8 浏览器Cookie的处理
Jan 31 Javascript
Javascript 类与静态类的实现(续)
Apr 02 Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
Jun 16 Javascript
第五篇Bootstrap 排版
Jun 21 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
Sep 03 Javascript
JS中的作用域链
Mar 01 Javascript
vue之数据交互实例代码
Jun 20 Javascript
js学习总结_基于数据类型检测的四种方式(必看)
Jul 04 Javascript
jQuery实现每隔一段时间自动更换样式的方法分析
May 03 jQuery
详解vue-cli下ESlint 配置说明
Sep 03 Javascript
浅谈Angular7 项目开发总结
Dec 19 Javascript
微信小程序实现多张图片上传功能
Nov 18 Javascript
为你的网站增加亮点的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
图形数字验证代码
2006/10/09 PHP
mac下Apache + MySql + PHP搭建网站开发环境
2014/06/02 PHP
PHP中Fatal error session_start()错误解决步骤
2014/08/05 PHP
js鼠标左右键 键盘值小结
2010/06/11 Javascript
ExtJs中简单的登录界面制作方法
2010/08/19 Javascript
ASP.NET jQuery 实例14 在ASP.NET form中校验时间范围
2012/02/03 Javascript
Jquery上传插件 uploadify v3.1使用说明
2012/06/18 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
整理Javascript事件响应学习笔记
2015/12/02 Javascript
JavaScript获取客户端IP的方法(新方法)
2016/03/11 Javascript
ThinkJS中如何使用MongoDB的CURD操作
2016/12/13 Javascript
JS实现移动端按首字母检索城市列表附源码下载
2017/07/05 Javascript
vue通过点击事件读取音频文件的方法
2018/05/30 Javascript
使用bootstrap实现下拉框搜索功能的实例讲解
2018/08/10 Javascript
Node.js搭建WEB服务器的示例代码
2018/08/15 Javascript
JavaScript中Array方法你该知道的正确打开方法
2018/09/11 Javascript
自定义javascript验证框架示例【附源码下载】
2019/05/31 Javascript
ES6新增的数组知识实例小结
2020/05/23 Javascript
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
2020/12/25 Vue.js
[01:06] DOTA2英雄背景故事第三期之秩序法则光之守卫
2020/07/07 DOTA
python单例模式实例分析
2015/04/08 Python
Python查找两个有序列表中位数的方法【基于归并算法】
2018/04/20 Python
Python如何用filter函数筛选数据
2020/03/05 Python
使用Dajngo 通过代码添加xadmin用户和权限(组)
2020/07/03 Python
纯CSS3代码实现switch滑动开关按钮效果
2016/08/30 HTML / CSS
世界上最伟大的马产品:Equiderma
2020/01/07 全球购物
电气专业推荐信范文
2013/11/18 职场文书
教育局长自荐信范文
2013/12/22 职场文书
小学生开学感言
2014/02/28 职场文书
法制宣传实施方案
2014/03/13 职场文书
岗位廉政承诺书
2014/03/27 职场文书
纪检干部现实表现材料
2014/08/21 职场文书
股指期货心得体会
2014/09/10 职场文书
员工教育培训协议书
2014/09/27 职场文书
病人家属写给医院的感谢信
2015/01/23 职场文书
Java Spring 控制反转(IOC)容器详解
2021/10/05 Java/Android