编程 Javascript

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>

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

一些常用的Javascript函数

Dec 22 Javascript

javascript运行机制之this详细介绍

Feb 07 Javascript

漫谈JS引擎的运行机制你应该知道什么

Jun 15 Javascript

再次谈论Javascript中的this

Jun 23 Javascript

由浅入深剖析Angular表单验证

Jul 14 Javascript

js简单时间比较的方法

Aug 02 Javascript

在web中js实现类似excel的表格控件

Sep 01 Javascript

vue devtools的安装与使用教程

Aug 08 Javascript

Vue.js 图标选择组件实践详解

Dec 03 Javascript

详解vue为什么要求组件模板只能有一个根元素

Jul 22 Javascript

JS如何实现动态添加的元素绑定事件

Nov 12 Javascript

低门槛开发iOS、Android、小程序应用的前端框架详解

Oct 16 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

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

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