小试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 相关文章推荐
js实现特定位取反原理及示例
Jun 30 Javascript
JavaScript实现向OL列表内动态添加LI元素的方法
Mar 21 Javascript
JavaScript动态改变表格单元格内容的方法
Mar 30 Javascript
JavaScript判断undefined类型的正确方法
Jun 30 Javascript
微信小程序 tabs选项卡效果的实现
Jan 05 Javascript
JS中的作用域链
Mar 01 Javascript
JS简单获取当前日期时间的方法(如:2017-03-29 11:41:10 星期四)
Mar 29 Javascript
详解JavaScript中的六种错误类型
Sep 21 Javascript
使用vue-router在Vue页面之间传递数据的方法
Jul 15 Javascript
js全屏事件fullscreenchange 实现全屏、退出全屏操作
Sep 17 Javascript
JavaScript多种图形实现代码实例
Jun 28 Javascript
Ajax实现异步加载数据
Nov 17 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 数组的创建、调用和更新实现代码
2009/03/09 PHP
php实现的一个简单json rpc框架实例
2015/03/30 PHP
PHP cookie,session的使用与用户自动登录功能实现方法分析
2019/06/05 PHP
js 链式延迟执行DOME
2012/01/04 Javascript
jquery等宽输出文字插件使用介绍
2013/09/18 Javascript
JS将所有对象s的属性复制给对象r(原生js+jquery)
2014/01/25 Javascript
JavaScript用JQuery呼叫Server端方法示例代码
2014/09/03 Javascript
JavaScript tab选项卡插件实例代码
2016/02/23 Javascript
jQuery的框架介绍
2016/05/11 Javascript
Knockoutjs 学习系列(一)ko初体验
2016/06/07 Javascript
vuejs如何配置less
2017/04/25 Javascript
Vue.js教程之axios与网络传输的学习实践
2017/04/29 Javascript
Node.JS文件系统解析实例详解
2017/05/15 Javascript
JS数组交集、并集、差集的示例代码
2017/08/23 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
2019/04/15 Javascript
vue+element加入签名效果(移动端可用)
2019/06/17 Javascript
JS实现简单随机3D骰子
2019/10/24 Javascript
Vue双向绑定实现原理与方法详解
2020/05/07 Javascript
jquery绑定事件 bind和on的用法与区别分析
2020/05/22 jQuery
Python lxml模块安装教程
2015/06/02 Python
Python中多个数组行合并及列合并的方法总结
2018/04/12 Python
Python实现Event回调机制的方法
2019/02/13 Python
Python线程条件变量Condition原理解析
2020/01/20 Python
Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript实现社交分享系统
2020/04/21 Python
15个应该掌握的Jupyter Notebook使用技巧(小结)
2020/09/23 Python
css3 transform及原生js实现鼠标拖动3D立方体旋转
2016/06/20 HTML / CSS
Craghoppers德国官网:户外和旅行服装
2020/02/14 全球购物
会计找工作求职信范文
2013/12/09 职场文书
大学生学习自我评价
2014/01/13 职场文书
网络技术专业推荐信
2014/02/20 职场文书
租赁协议书范本
2014/04/22 职场文书
大学中国梦演讲稿
2014/04/23 职场文书
家长会演讲稿
2014/04/26 职场文书
2015年乡镇安全生产工作总结
2015/05/19 职场文书
Python使用scapy模块发包收包
2021/05/07 Python
sql server删除前1000行数据的方法实例
2021/08/30 SQL Server