Jquery Ajax 学习实例2 向页面发出请求 返回JSon格式数据


Posted in Javascript onMarch 15, 2010

一、AjaxJson.aspx

处理业务数据,产生JSon数据,供JqueryRequest.aspx调用,代码如下:

protected void Page_Load(object sender, EventArgs e) 
{ 
string u = Request["UserName"]; 
string p = Request["Password"]; 
string output = string.Format("'UserName':'{0}','Password':'{1}'", u, p); 
Response.Write("[{"); 
Response.Write(output); 
Response.Write("}]"); 
Response.End(); 
}

二、JqueryRequest.aspx

通过点击按钮来请求AjaxJson.aspx,获取JSon数据。代码如下:


<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script type="text/javascript" language="javascript" src="js/jquery-1.3.2.js"></script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="text" name="Text1" id="Text1"/><br /> 
<input type="text" name="Text2" id="Text2"/> 
<br /> 
<input type="button" id="btn1" onclick="BtnClick()" /> 
</div> 
<div id="dd"> 
sd 
</div> 
<div> 
<script type="text/javascript" language="javascript"> 
function BtnClick() { 
var uid = $("#Text1").val(); 
var pwd = $("#Text2").val(); 
$.ajax({ 
url: "AjaxJson.aspx", 
type: "POST", 
data: { UserName: uid, Password: pwd }, 
success: function(data) { 
var json = eval(data); //eval("(" + data + ")"); 
$.each(json, function(idx, item) { 
var user = item.UserName; 
var pass = item.Password; 
$("#dd").html("<h1>用户名:" + user + " 密码:" + pass + "</h1>"); 
}); 
} 
}); 
} 
</script> 
</div> 
</form> 
</body> 
</html>

Javascript 相关文章推荐
Extjs学习笔记之七 布局
Jan 08 Javascript
ext 列表页面关于多行查询的办法
Mar 25 Javascript
div层的移动及性能优化
Nov 16 Javascript
jQuery实现ichat在线客服插件
Dec 29 Javascript
angularJS中$apply()方法详解
Jan 07 Javascript
小议JavaScript中Generator和Iterator的使用
Jul 29 Javascript
jQuery+ajax实现实用的点赞插件代码
Jul 06 Javascript
使用AngularJS对表单提交内容进行验证的操作方法
Jul 12 Javascript
vue cli3.0 引入eslint 结合vscode使用
May 27 Javascript
vue动态绘制四分之三圆环图效果
Sep 03 Javascript
基于js判断浏览器是否支持webGL
Apr 18 Javascript
JS代码简洁方式之函数方法详解
Jul 28 Javascript
jQuery MD5加密实现代码
Mar 15 #Javascript
[原创]js获取数组任意个不重复的随机数组元素
Mar 15 #Javascript
javascript实现的在当前窗口中漂浮框的代码
Mar 15 #Javascript
javascript 用记忆函数快速计算递归函数
Mar 15 #Javascript
JS 密码强度验证(兼容IE,火狐,谷歌)
Mar 15 #Javascript
javascript css styleFloat和cssFloat
Mar 15 #Javascript
javascript 嵌套的函数(作用域链)
Mar 15 #Javascript
You might like
php 获取mysql数据库信息代码
2009/03/12 PHP
php摘要生成函数(无乱码)
2012/02/04 PHP
Session服务器配置指南与使用经验的深入解析
2013/06/17 PHP
php常用正则函数实例小结
2016/12/29 PHP
PHP随机获取未被微信屏蔽的域名(微信域名检测)
2017/03/19 PHP
Laravel框架路由管理简单示例
2019/05/07 PHP
JavaScript 学习笔记(九)call和apply方法
2010/01/11 Javascript
javascript 兼容所有浏览器的DOM扩展功能
2012/08/01 Javascript
jQuery中fadeIn、fadeOut、fadeTo的使用方法(图片显示与隐藏)
2013/05/08 Javascript
javascript自定义startWith()和endWith()的两种方法
2013/11/11 Javascript
javascript scrollTop正解使用方法
2013/11/14 Javascript
关于页面嵌入swf覆盖div层的问题的解决方法
2014/02/11 Javascript
将中国标准时间转换成标准格式的代码
2014/03/20 Javascript
Jquery修改页面标题title其它JS失效的解决方法
2014/10/31 Javascript
swtich/if...else的替代语句
2015/08/16 Javascript
使用canvas实现仿新浪微博头像截取上传功能
2015/09/02 Javascript
jquery 实现输入邮箱时自动补全下拉提示功能
2015/10/04 Javascript
Node.js如何自动审核团队的代码
2016/07/20 Javascript
深入浅析Vue组件开发
2016/11/25 Javascript
Angularjs的$http异步删除数据详解及实例
2017/07/27 Javascript
微信小程序获取手机网络状态的方法【附源码下载】
2017/12/08 Javascript
微信小程序实现登录注册tab切换效果
2020/12/29 Javascript
详解vue或uni-app的跨域问题解决方案
2020/02/21 Javascript
微信小程序tab左右滑动切换功能的实现代码
2021/02/08 Javascript
Python中optparse模块使用浅析
2015/01/01 Python
Python的Twisted框架上手前所必须了解的异步编程思想
2016/05/25 Python
Python中__slots__属性介绍与基本使用方法
2018/09/05 Python
python实现自动获取IP并发送到邮箱
2018/12/26 Python
酒吧总经理岗位职责
2013/12/10 职场文书
药剂专业学生求职信范文
2013/12/28 职场文书
2014迎国庆标语大全
2014/09/19 职场文书
2015感人爱情寄语
2015/02/26 职场文书
2016毕业实习单位评语大全
2015/12/01 职场文书
Django REST framework 限流功能的使用
2021/06/24 Python
总结高并发下Nginx性能如何优化
2021/11/01 Servers
MySQL时区造成时差问题
2022/04/13 MySQL