小试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 相关文章推荐
用javascript实现页面打印的三种方法
Mar 05 Javascript
CLASS_CONFUSION JS混淆 全源码
Dec 12 Javascript
js对图片base64编码字符串进行解码并输出图像示例
Mar 17 Javascript
jquery实现表单输入时提示文字滑动向上效果
Aug 10 Javascript
简单谈谈JS数组中的indexOf方法
Oct 13 Javascript
浅谈jquery中next与siblings的区别
Oct 27 Javascript
angular实现IM聊天图片发送实例
May 08 Javascript
vue路由懒加载的实现方法
Mar 12 Javascript
深入理解Vue 组件之间传值
Aug 16 Javascript
vue表单自定义校验规则介绍
Aug 28 Javascript
微信小程序iBeacon测距及稳定程序的实现解析
Jul 31 Javascript
微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现
Aug 19 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
php GeoIP的使用教程
2011/03/09 PHP
PHP查询MySQL大量数据的时候内存占用分析
2011/07/22 PHP
php使用gettimeofday函数返回当前时间并存放在关联数组里
2015/03/19 PHP
javascript dom代码应用 简单的相册[firefox only]
2010/06/12 Javascript
javascript基础知识大集锦(二) 推荐收藏
2011/01/13 Javascript
JavaScript 高级篇之函数 (四)
2012/04/07 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
2020/11/18 Javascript
jQuery 全选 全不选 事件绑定的实现代码
2017/01/23 Javascript
Webpack 之 babel-loader文件预处理器详解
2018/03/23 Javascript
jQuery中可见性过滤器简单用法示例
2018/03/31 jQuery
vue移动端监听滚动条高度的实现方法
2018/09/03 Javascript
微信小程序自定义底部导航带跳转功能
2018/11/27 Javascript
微信小程序实现的canvas合成图片功能示例
2019/05/03 Javascript
解决layui批量传值到后台操作时出现传值为空的问题
2019/09/28 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
python处理圆角图片、圆形图片的例子
2014/04/25 Python
详谈Python2.6和Python3.0中对除法操作的异同
2017/04/28 Python
tensorflow使用range_input_producer多线程读取数据实例
2020/01/20 Python
Python 动态变量名定义与调用方法
2020/02/09 Python
Python3.6 中的pyinstaller安装和使用教程
2020/03/16 Python
Python GUI编程学习笔记之tkinter界面布局显示详解
2020/03/30 Python
ghd澳大利亚官方网站:英国最受欢迎的美发工具品牌
2018/05/21 全球购物
欧姆龙医疗保健与医疗产品:Omron Healthcare
2020/02/10 全球购物
职业生涯规划书的格式
2013/12/29 职场文书
农村婚礼证婚词
2014/01/10 职场文书
社区七一党员活动方案
2014/01/25 职场文书
大二法学专业职业生涯规划范文
2014/02/12 职场文书
公务员试用期满考核材料
2014/05/22 职场文书
汽车维修求职信
2014/06/15 职场文书
机关保密工作承诺书
2015/05/04 职场文书
小兵张嘎电影观后感
2015/06/03 职场文书
食品安全主题班会
2015/08/13 职场文书
创业计划书之奶茶店开店方案范本!
2019/08/06 职场文书
赞美教师的句子
2019/09/02 职场文书
css3实现背景图片颜色修改的多种方式
2021/04/13 HTML / CSS
如何通过一篇文章了解Python中的生成器
2022/04/02 Python