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 相关文章推荐
图片连续滚动代码[兼容IE/firefox]
Jun 11 Javascript
jquery 弹出登录窗口实现代码
Dec 24 Javascript
JS getMonth()日期函数的值域是0-11
Feb 15 Javascript
JSON 学习之JSON in JavaScript详细使用说明
Feb 23 Javascript
使用js实现的简单拖拽效果
Mar 18 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
Sep 02 Javascript
ES6中的箭头函数实例详解
Apr 06 Javascript
JavaScript数组去重的多种方法(四种)
Sep 19 Javascript
node.js基础知识小结
Feb 26 Javascript
Element 默认勾选表格 toggleRowSelection的实现
Sep 04 Javascript
angula中使用iframe点击后不执行变更检测的问题
May 10 Javascript
JavaScript 去重和重复次数统计
Mar 31 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
全国FM电台频率大全 - 4 山西省
2020/03/11 无线电
php的$_FILES的临时储存文件与回收机制实测过程
2013/07/12 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
Zend Framework入门知识点小结
2016/03/19 PHP
PHP常用排序算法实例小结【基本排序,冒泡排序,快速排序,插入排序】
2017/02/07 PHP
php实现批量上传数据到数据库(.csv格式)的案例
2017/06/18 PHP
Windows下wamp php单元测试工具PHPUnit安装及生成日志文件配置方法
2018/05/28 PHP
借用Google的Javascript API Loader来加速你的网站
2009/01/28 Javascript
基于jQuery的树控件实现代码(asp.net+json)
2010/07/11 Javascript
jQuery ajax 路由和过滤器使用说明
2011/08/02 Javascript
JS实现时间格式化的方式汇总
2013/10/16 Javascript
浅谈javascript属性onresize
2015/04/20 Javascript
js实现人才网站职位选择功能的方法
2015/08/14 Javascript
jquery实现左右滑动菜单效果代码
2015/08/27 Javascript
JS简单编号生成器实现方法(附demo源码下载)
2016/04/05 Javascript
基于jquery实现即时检查格式是否正确的表单
2016/05/06 Javascript
vue-hook-form使用详解
2017/04/07 Javascript
js微信分享实现代码
2020/10/11 Javascript
Angular 作用域scope的具体使用
2017/12/11 Javascript
浅析vue中常见循环遍历指令的使用 v-for
2018/04/18 Javascript
JQueryDOM之样式操作
2019/03/27 jQuery
javascript系统时间设置操作示例
2019/06/17 Javascript
JS插件amCharts实现绘制柱形图默认显示数值功能示例
2019/11/26 Javascript
JavaScript中作用域链的概念及用途讲解
2020/08/06 Javascript
如何管理Vue中的缓存页面
2021/02/06 Vue.js
Python open读写文件实现脚本
2008/09/06 Python
Python时间戳与时间字符串互相转换实例代码
2013/11/28 Python
Python编程中使用Pillow来处理图像的基础教程
2015/11/20 Python
python基于itchat实现微信群消息同步机器人
2017/02/27 Python
python tornado微信开发入门代码
2018/08/24 Python
美国体育用品在线:Modell’s Sporting Goods
2018/06/07 全球购物
工作中个人的自我评价
2013/12/31 职场文书
2014年九一八事变演讲稿
2014/09/14 职场文书
2014年工人工作总结
2014/11/25 职场文书
中学生清明节演讲稿
2015/03/18 职场文书
React Fragment介绍与使用详解
2021/11/11 Javascript