Jquery Ajax请求代码(2)


Posted in Javascript onJanuary 07, 2011

添加引用Dll文件就可以使用了,很方便的。 /201101/tools/Newtonsoft.Json.Net20.rar
在jquery库中,getJSON其实是调用的:Query.get(url, data, callback, "json")
其中参数也是以k/v对格式发出。请求返回的可以看到:在服务端以Customer列表集合返回
现在来看一下事列:
件一个Common类

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); 
}

在前台Jquery中加载调用ashx代码
通过getJSON向ashx请求数据。返回的数据为JSON对象
$().ready(function() { 
$.getJSON("JqueryData2.ashx", function(data) { 
alert(data.Memo); 
}); 
$.getJSON("JqueryData2.ashx", function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
tt += k + ":" + v + "<br/>"; 
}) 
$("#disHows").html(tt); 
}); 
});

(二)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( 
"JqueryData2.ashx", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
$.each(v,function(kk, vv) { 
tt += kk + ":" + vv + "<br/>"; 
}); 
}); 
$("#divmessage").html(tt); 
}); 
} 
[code] 
(三)请求aspx文件中的CS 
[code] 
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声明,其它全部删除
Jquery代码
function GetCustomer_Aspx() { 
$.getJSON( 
"webdata/Json_1.aspx", 
function(data) { 
var tt = ""; 
$.each(data, function(k, v) { 
tt += k + ":" + v + "<br/>"; 
}) 
$("#divmessage").html(tt); 
}); 
}

(四)请求文本文件
文本文件提供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); 
}); 
}

解析的方法与ashx的解析相同
在Txt文件中对于多行的格式如下:
文本内容:
[
{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); 
}); 
}

/201101/tools/Newtonsoft.Json.Net20.rar
Javascript 相关文章推荐
同时使用n个window onload加载实例介绍
Apr 25 Javascript
JavaScript实现动态添加,删除行的方法实例详解
Jul 02 Javascript
浅谈javascript的Touch事件
Sep 27 Javascript
18个非常棒的jQuery代码片段
Nov 02 Javascript
解决浏览器会自动填充密码的问题
Apr 28 Javascript
jquery的 filter()方法使用教程
Mar 22 jQuery
async/await地狱该如何避免详解
May 10 Javascript
在vue-cli的组件模板里使用font-awesome的两种方法
Sep 28 Javascript
微信小程序实现跳转的几种方式总结(推荐)
Apr 24 Javascript
jQuery 判断元素是否存在然后按需加载内容的实现代码
Jan 16 jQuery
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
Dec 24 Javascript
vue项目打包后提交到git上为什么没有dist这个文件的解决方法
Sep 16 Javascript
JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参
Jan 06 #Javascript
神奇的7个jQuery 3D插件整理
Jan 06 #Javascript
jquery下为Event handler传递动态参数的代码
Jan 06 #Javascript
Jquery下判断Id是否存在的代码
Jan 06 #Javascript
jquery关于图形报表的运用实现代码
Jan 06 #Javascript
基于Jquery的简单图片切换效果
Jan 06 #Javascript
基于jquery的分页控件(C#)
Jan 06 #Javascript
You might like
《PHP编程最快明白》第三讲:php数组
2010/11/01 PHP
PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数
2012/04/09 PHP
php将字符串随机分割成不同长度数组的方法
2015/06/01 PHP
ECshop 迁移到 PHP7版本时遇到的兼容性问题
2016/02/15 PHP
DWZ+ThinkPHP开发时遇到的问题分析
2016/12/12 PHP
php-app开发接口加密详解
2018/04/18 PHP
自动检查并替换文本框内的字符
2006/06/30 Javascript
JQuery1.4+ Ajax IE8 内存泄漏问题
2010/10/15 Javascript
鼠标滚轮控制网页横向移动实现思路
2013/03/22 Javascript
jquery鼠标滑过提示title具体实现代码
2013/08/06 Javascript
Jquery中给animation加更多的运作效果实例
2013/09/05 Javascript
js showModalDialog参数的使用详解
2014/01/07 Javascript
JavaScript中合并数组的N种方法
2014/09/16 Javascript
深入理解JavaScript系列(30):设计模式之外观模式详解
2015/03/03 Javascript
Javascript编写俄罗斯方块思路及实例
2015/07/07 Javascript
js 提交form表单和设置form表单请求路径的实现方法
2016/10/25 Javascript
BootStrap modal模态弹窗使用小结
2016/10/26 Javascript
js与jquery分别实现tab标签页功能的方法
2016/11/18 Javascript
bootstrap制作jsp页面(根据值让table显示选中)
2017/01/05 Javascript
JQuery判断正整数整理小结
2017/08/21 jQuery
angular中不同的组件间传值与通信的方法
2017/11/04 Javascript
jquery中done和then的区别(详解)
2017/12/19 jQuery
在Mac下彻底卸载node和npm的方法
2018/05/16 Javascript
Vue中使用canvas方法总结
2019/02/12 Javascript
使用xampp将angular项目运行在web服务器的教程
2019/09/16 Javascript
vue 项目引入echarts 添加点击事件操作
2020/09/09 Javascript
使用python3+xlrd解析Excel的实例
2018/05/04 Python
解决python3 网络请求路径包含中文的问题
2018/05/10 Python
Numpy数据类型转换astype,dtype的方法
2018/06/09 Python
pygame实现俄罗斯方块游戏
2018/06/26 Python
突袭HTML5之Javascript API扩展1—Web Worker异步执行及相关概述
2013/01/31 HTML / CSS
会计出纳岗位职责
2013/12/25 职场文书
教师党员个人自我剖析材料
2014/09/29 职场文书
离婚案件答辩状
2015/05/22 职场文书
MySQL利用UNION连接2个查询排序失效详解
2021/11/20 MySQL
vue 给数组添加新对象并赋值
2022/04/20 Vue.js