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 相关文章推荐
在网页里看flash的trace数据的js类
Jan 10 Javascript
javascript 动态修改样式和层叠样式表代码
Apr 27 Javascript
JavaScript prototype属性使用说明
May 13 Javascript
基于jQuery的输入框无值自动显示指定数据的实现代码
Jan 24 Javascript
JavaScript闭包函数访问外部变量的方法
Aug 27 Javascript
关于编写性能高效的javascript事件的技术
Nov 28 Javascript
关于angularJs指令的Scope(作用域)介绍
Oct 25 Javascript
angularjs定时任务的设置与清除示例
Jun 02 Javascript
javascript 面向对象实战思想分享
Sep 07 Javascript
AngularJS实现的2048小游戏功能【附源码下载】
Jan 03 Javascript
解决vue-cli3 使用子目录部署问题
Jul 19 Javascript
解决vue更新路由router-view复用组件内容不刷新的问题
Nov 04 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文件上传问题汇总(文件大小检测、大文件上传处理)
2015/12/24 PHP
PHP打印输出函数汇总
2016/08/28 PHP
php+mongodb判断坐标是否在指定多边形区域内的实例
2016/10/28 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
laravel实现图片上传预览,及编辑时可更换图片,并实时变化的例子
2019/11/14 PHP
js静态作用域的功能。
2006/12/25 Javascript
jquery等宽输出文字插件使用介绍
2013/09/18 Javascript
使用不同的方法结合/合并两个JS数组
2014/09/18 Javascript
vue组件中使用iframe元素的示例代码
2017/12/13 Javascript
layui实现下拉框三级联动
2019/07/26 Javascript
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
Python列表append和+的区别浅析
2015/02/02 Python
Python批量重命名同一文件夹下文件的方法
2015/05/25 Python
Python实现生成随机数据插入mysql数据库的方法
2017/12/25 Python
Python实现上下班抢个顺风单脚本
2018/02/07 Python
解决在pycharm中显示额外的 figure 窗口问题
2019/01/15 Python
python实现海螺图片的方法示例
2019/05/12 Python
对python 树状嵌套结构的实现思路详解
2019/08/09 Python
使用pyshp包进行shapefile文件修改的例子
2019/12/06 Python
浅析matlab中imadjust函数
2020/02/27 Python
python程序文件扩展名知识点详解
2020/02/27 Python
Python实现RabbitMQ6种消息模型的示例代码
2020/03/30 Python
django实现模板中的字符串文字和自动转义
2020/03/31 Python
解决Python发送Http请求时,中文乱码的问题
2020/04/30 Python
python与pycharm有何区别
2020/07/01 Python
python处理写入数据代码讲解
2020/10/22 Python
python如何利用paramiko执行服务器命令
2020/11/07 Python
使用Python解析Chrome浏览器书签的示例
2020/11/13 Python
Python tkinter之Bind(绑定事件)的使用示例
2021/02/05 Python
伦敦著名的运动鞋综合商店:Footpatrol
2019/03/25 全球购物
本科生的职业生涯规划范文
2014/01/09 职场文书
25岁生日感言
2014/01/13 职场文书
应届毕业生自荐书
2014/06/18 职场文书
社区文艺活动方案
2014/08/19 职场文书
党的群众路线对照检查材料
2014/08/27 职场文书
试用期转正后的自我评价
2014/09/21 职场文书