Jquery中getJSON在asp.net中的使用说明


Posted in Javascript onMarch 10, 2011

准备工作
·Customer类

public class Customer 
{ 
public int Unid { get; set; } 
public string CustomerName { get; set; } 
public string Memo { get; set; } 
public string Other { get; set; } 
}

(一)ashx

Customer customer = new Customer 
{ Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"}; 
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer); 
context.Response.Write(strJson);

function GetCustomer_Ashx() { 
$.getJSON( 
"webdata/Json_1.ashx", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
tt += k + ":" + v + "<br/>"; 
}) 
$("#divmessage").html(tt); 
}); 
}

·通过getJSON向ashx请求数据。返回的数据为JSON对象。
(二)ashx文件,但返回的是实体集合
Customer customer = new Customer 
{ Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"}; 
Customer customer2 = new Customer 
{ Unid = 2, CustomerName = "吴用", Memo = "天机星", Other = "智多星" }; 
List<Customer> _list = new List<Customer>(); 
_list.Add(customer); 
_list.Add(customer2); 
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(_list); 
context.Response.Write(strJson);

function GetCustomerList() { 
$.getJSON( 
"webdata/Json_1.ashx", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
$.each(v,function(kk, vv) { 
tt += kk + ":" + vv + "<br/>"; 
}); 
}); 
$("#divmessage").html(tt); 
}); 
}

 (三)请求aspx文件
·cs文件
protected void Page_Load(object sender, EventArgs e) 
{ 
Customer customer = new Customer 
{ Unid = 1, CustomerName = "宋江", Memo = "天魁星", Other = "黑三郎" }; 
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer); 
Response.Write(strJson); 
}

·Aspx文件
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Json_1.aspx.cs"
Inherits="webdata_Json_1" %>

前台文件只保留Page声明,其它全部删除。

·js文件

function GetCustomer_Aspx() { 
$.getJSON( 
"webdata/Json_1.aspx", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
tt += k + ":" + v + "<br/>"; 
}) 
$("#divmessage").html(tt); 
}); 
}

这个部分与请求ashx文件时相同。
请求实体集合时,与ashx时相同,这里不做重复。
(四)请求文本文件
文本文件提供json字符串,由$.getJSON得到json对象。
·文本文件
{Unid:1,CustomerName:"宋江",Memo:"天魁星",Other:"黑三郎"}
文本文件提供json串,对于json的组成格式,请参见其它文档。对于这一实体json,会被忽略空行与空格。
function GetCustomer_txt() { 
$.getJSON( 
"webdata/Json_1.txt", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
tt += k + ":" + v + "<br/>"; 
}) 
$("#divmessage").html(tt); 
}); 
}

解析的方法与其它的相同。

对于多行的如下:
文本:

[ 
{Unid:1,CustomerName:"宋江",Memo:"天魁星",Other:"黑三郎"}, 
{Unid:2,CustomerName:"吴用",Memo:"天机星",Other:"智多星"} 
]

解析:
function GetCustomer_TxtList() { 
$.getJSON( 
"webdata/Json_1.txt", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
$.each(v, function(kk, vv) { 
tt += kk + ":" + vv + "<br/>"; 
}); 
}); 
$("#divmessage").html(tt); 
}); 
}

与其它的相同。
(五)带参数ajax请求
以ashx为例子,按客户id来请求客户。
·Ashx文件
if(context.Request["iUnid"]==null) 
return; 
context.Response.ContentType = "text/plain"; 
Customer customer = new Customer 
{ Unid = 1, CustomerName = "宋江", Memo = "天魁星", Other = "黑三郎" }; 
Customer customer2 = new Customer 
{ Unid = 2, CustomerName = "吴用", Memo = "天机星", Other = "智多星" }; 
List<Customer> _list = new List<Customer>(); 
_list.Add(customer); 
_list.Add(customer2); int iCustomerId =Convert.ToInt32(context.Request["iUnid"]); 
var cus = from q in _list 
where q.Unid == iCustomerId 
select q; 
string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(cus); 
context.Response.Write(strJson);

·ajax请求
function GetCustomer_AshxWithPara() { 
$.getJSON( 
"webdata/Json_2.ashx", 
{ iUnid: 1 }, 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
$.each(v, function(kk, vv) { 
tt += kk + ":" + vv + "<br/>"; 
}); 
}); 
$("#divmessage").html(tt); 
}); 
}

其中参数也是以k/v对格式发出。请求返回的可以看到:在服务端以Customer列表集合返回。

在jquery库中,getJSON其实是调用的:Query.get(url, data, callback, "json")
这点很重要。

Javascript 相关文章推荐
用js怎么把&amp;字符换成&quot;&amp;amp:&quot;
Oct 19 Javascript
javascript获取下拉列表框当中的文本值示例代码
Jul 31 Javascript
JS限制Textarea文本域字符个数的具体实现
Aug 02 Javascript
jquery解析JSON数据示例代码
Mar 17 Javascript
jquery解决客户端跨域访问问题
Jan 06 Javascript
动态加载jQuery的方法
Jun 16 Javascript
jQuery ajax方法传递中文时出现中文乱码的解决方法
Jul 25 Javascript
jQuery实现的表头固定效果实例【附完整demo源码下载】
Aug 01 Javascript
JSONP和批量操作功能的实现方法
Aug 21 Javascript
jQuery操作之效果详解
May 19 jQuery
详解webpack3编译兼容IE8的正确姿势
Dec 21 Javascript
Vue实例的对象参数options的几个常用选项详解
Nov 08 Javascript
JQuery中的$.getJSON 使用说明
Mar 10 #Javascript
基于jquery的地址栏射击游戏代码
Mar 10 #Javascript
基于jquery的无缝循环新闻列表插件
Mar 07 #Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
Mar 07 #Javascript
jQuery总体架构的理解分析
Mar 07 #Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
Mar 06 #Javascript
js中将具有数字属性名的对象转换为数组
Mar 06 #Javascript
You might like
php5 pdo新改动加载注意事项
2008/09/11 PHP
mysql数据库差异比较的PHP代码
2012/02/05 PHP
PHP设计模式之解释器模式的深入解析
2013/06/13 PHP
详解如何在云服务器上部署Laravel
2017/06/30 PHP
最近项目写了一些js,水平有待提高
2009/01/31 Javascript
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
JavaScript与DOM组合动态创建表格实例
2012/12/23 Javascript
jQuery中setTimeout的几种使用方法小结
2013/04/07 Javascript
JavaScript计算字符串中每个字符出现次数的小例子
2013/07/02 Javascript
浅析javascript 定时器
2014/12/23 Javascript
jQuery实现鼠标滚轮动态改变样式或效果
2015/01/05 Javascript
JavaScript中常用的六种互动方法示例
2015/03/13 Javascript
基于canvas实现的绚丽圆圈效果完整实例
2016/01/26 Javascript
JS实现的几个常用算法
2016/11/12 Javascript
Express与NodeJs创建服务器的两种方法
2017/02/06 NodeJs
vue.js获取数据库数据实例代码
2017/05/26 Javascript
js时间戳与日期格式之间转换详解
2017/12/11 Javascript
Angular 封装并发布组件的方法示例
2018/04/19 Javascript
详解Vue 换肤方案验证
2019/08/28 Javascript
Python爬虫实现模拟点击动态页面
2020/03/05 Python
Keras-多输入多输出实例(多任务)
2020/06/22 Python
python3.8动态人脸识别的实现示例
2020/09/21 Python
手把手教你从PyCharm安装到激活(最新激活码),亲测有效可激活至2089年
2020/11/25 Python
用sleep间隔进行python反爬虫的实例讲解
2020/11/30 Python
解决python3.6用cx_Oracle库连接Oracle的问题
2020/12/07 Python
Sunglasses Shop瑞典:欧洲领先的太阳镜网上商店
2018/04/22 全球购物
KIEHL’S科颜氏官方旗舰店:源自美国的顶级护肤品牌
2018/06/07 全球购物
经贸韩语专业大学生职业规划
2014/02/14 职场文书
淘宝客服工作职责
2014/07/11 职场文书
2014年药品销售工作总结
2014/12/16 职场文书
2015年度工程师评职称工作总结
2015/10/14 职场文书
小学数学教学反思范文
2016/02/16 职场文书
java executor包参数处理功能 
2022/02/15 Java/Android
mysql insert 存在即不插入语法说明
2022/03/25 MySQL
Python利用capstone实现反汇编
2022/04/06 Python
Win11 21h2可以升级22h2吗?看看你的电脑符不符合要求
2022/07/07 数码科技