小试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 相关文章推荐
newxtree.js代码
Mar 13 Javascript
使用JavaScript switch case 另类写法
Mar 14 Javascript
一个js控制的导航菜单实例代码
Dec 03 Javascript
jQuery实现自定义下拉列表
Jan 05 Javascript
js友好的时间返回函数
Aug 24 Javascript
详解vee-validate的使用个人小结
Jun 07 Javascript
详解angularjs popup-table 弹出框表格指令
Sep 20 Javascript
Nginx 配置多站点vhost 的方法
Jan 07 Javascript
vuex actions传递多参数的处理方法
Sep 18 Javascript
对angular 实时更新模板视图的方法$apply详解
Oct 09 Javascript
Angular 中使用 FineReport不显示报表直接打印预览
Aug 21 Javascript
jQuery轮播图功能制作方法详解
Dec 03 jQuery
为你的网站增加亮点的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中接口与抽象类的区别
2013/06/08 PHP
Yii框架弹出框功能示例
2017/01/07 PHP
PHP 多任务秒级定时器的实现方法
2018/05/13 PHP
php使用curl模拟多线程实现批处理功能示例
2019/07/25 PHP
javascript之更有效率的字符串替换
2008/08/02 Javascript
javascript学习基础笔记之DOM对象操作
2011/11/03 Javascript
用最通俗易懂的代码帮助新手理解javascript闭包 推荐
2012/03/01 Javascript
Node.js文件操作详解
2014/08/16 Javascript
使用原生JS实现弹出层特效
2014/12/22 Javascript
javascript中对变量类型的判断方法
2015/08/09 Javascript
JS实现的仿QQ空间图片弹出效果代码
2016/02/23 Javascript
原生javascript实现分享到朋友圈功能 支持ios和android
2016/05/11 Javascript
Bootstrap Paginator分页插件使用方法详解
2016/05/30 Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
2016/06/13 Javascript
Select下拉框模糊查询功能实现代码
2016/07/22 Javascript
利用Angular.js限制textarea输入的字数
2016/10/20 Javascript
Bootstrap3 图片(响应式图片&amp;图片形状)
2017/01/04 Javascript
jQuery 插件实现随机自由弹跳气泡样式
2017/01/12 Javascript
canvas绘制环形进度条
2017/02/23 Javascript
第一次记录Bootstrap table学习笔记(1)
2017/05/18 Javascript
vue中的provide/inject的学习使用
2018/05/09 Javascript
jquery html添加元素/删除元素操作实例详解
2020/05/20 jQuery
可拖拽组件slider.js使用方法详解
2020/12/04 Javascript
JavaScript使用setTimeout实现倒计时效果
2021/02/19 Javascript
[02:25]DOTA2英雄基础教程 虚空假面
2014/01/02 DOTA
用Python编写脚本使IE实现代理上网的教程
2015/04/23 Python
利用Python中的pandas库对cdn日志进行分析详解
2017/03/07 Python
matplotlib调整子图间距,调整整体空白的方法
2018/08/03 Python
微软开源最强Python自动化神器Playwright(不用写一行代码)
2021/01/05 Python
详解Pymongo常用查询方法总结
2021/01/29 Python
HTML5实践-图片设置成灰度图
2012/11/12 HTML / CSS
教师推荐信范文
2013/11/24 职场文书
创建青年文明号材料
2014/05/09 职场文书
户外亲子活动总结
2015/05/08 职场文书
2016年小学端午节活动总结
2016/04/01 职场文书
数据库的高级查询六:表连接查询:外连接(左外连接,右外连接,UNION关键字,连接中ON与WHERE的不同)
2021/04/05 MySQL