小试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学习笔记7 原型链的原理
Jan 11 Javascript
jQuery参数列表集合
Apr 06 Javascript
javascript 另一种图片滚动切换效果思路
Apr 20 Javascript
编程语言JavaScript简介
Oct 16 Javascript
DOM操作一些常用的属性汇总
Mar 13 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
Aug 11 Javascript
jquery实现通用的内容渐显Tab选项卡效果
Sep 07 Javascript
AngularJS使用ng-app自动加载bootstrap框架问题分析
Jan 04 Javascript
浅谈jquery拼接字符串效率比较高的方法
Feb 22 Javascript
vue微信分享出来的链接点开是首页问题的解决方法
Nov 28 Javascript
jquery ui 实现 tab标签功能示例【测试可用】
Jul 25 jQuery
Vue实现腾讯云点播视频上传功能的实现代码
Aug 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下使用SimpleXML 处理XML 文件
2010/02/27 PHP
PHP自动识别字符集并完成转码详解
2013/08/02 PHP
php恢复数组的key为数字序列的方法
2015/04/28 PHP
php回调函数处理数组操作示例
2020/04/13 PHP
Jquery判断IE6等浏览器的代码
2011/04/05 Javascript
IE浏览器中图片onload事件无效的解决方法
2014/04/29 Javascript
关于jQuery判断元素是否存在的问题示例探讨
2014/07/21 Javascript
extjs 如何给column 加上提示
2014/07/29 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
浅谈js 闭包引起的内存泄露问题
2015/06/22 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
JavaScript中this详解
2015/09/01 Javascript
js正则表达式验证邮件地址
2015/11/12 Javascript
Bootstrap 网站实例之单页营销网站
2016/10/20 Javascript
Angular的MVC和作用域
2016/12/26 Javascript
浅谈js算法和流程控制
2016/12/29 Javascript
详解JS中定时器setInterval和setTImeout的this指向问题
2017/01/06 Javascript
js字符串与Unicode编码互相转换
2017/05/17 Javascript
VUE前端cookie简单操作
2017/10/17 Javascript
微信小程序用户信息encryptedData详解
2018/08/24 Javascript
vue+element模态框中新增模态框和删除功能
2019/06/11 Javascript
[40:55]Liquid vs LGD 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python遍历numpy数组的实例
2018/04/04 Python
pandas.loc 选取指定列进行操作的实例
2018/05/18 Python
Python之时间和日期使用小结
2019/02/14 Python
python实现将文件夹内的每张图片批量分割成多张
2019/07/22 Python
Python3 sys.argv[ ]用法详解
2019/10/24 Python
pytorch torch.expand和torch.repeat的区别详解
2019/11/05 Python
CSS3的Flexbox布局的简明入门指南
2016/04/08 HTML / CSS
StubHub墨西哥:购买和出售您的门票
2016/09/17 全球购物
世界上最大的隐形眼镜商店:1-800 Contacts
2018/11/03 全球购物
党课学习思想汇报
2014/01/02 职场文书
保安部任务及岗位职责
2014/02/25 职场文书
班干部竞选演讲稿
2014/04/24 职场文书
幼儿园欢迎词范文
2015/01/26 职场文书
Python中的np.argmin()和np.argmax()函数用法
2021/06/02 Python