页面代码

<form id="form1" runat="server">
<div>
<p> Ajax请求ashx返回json数据的常见问题 </p>
<button type="button" id="btnrq">点击请求数据</button>
</div>
<div id="iddiv"></div>
</form>

1   请求text数据,在success事件中手动解析    第一种返回json字符  

前台:

<script>
//第一种返回json字符
$(document).ready(function () {
$("#btnrq").click(function () {
$.ajax({
type: "post",
url: "Result.ashx",
data: { "name": "li" },
dataType: "text",
success: function (data) {
var json = eval('(' + data + ')')//为什么 加eval函数,本身的问题。 由于json是以”{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。
alert("性别:" + json.sex + ",爱好:" + json.interest);
// $("#iddiv").text(json.sex);
}
});

});
});
</script>

后台  :

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// context.Response.Write("Hello World");
request(context);
}
void request(HttpContext context) {
var name = context.Request["name"];
if (name == "li") {
string json = "{\"sex\":\"男\",\"interest\":\"篮球\" }";
context.Response.Write(json);
context.Response.End();
}
}

2. 请求json数据,在success事件中手动解析    JQ自动解析   第二种返回json对象

前台:

<script>
//第一种返回json字符
$(document).ready(function () {
$("#btnrq").click(function () {
$.ajax({
type: "post",
url: "Result.ashx",
data: { "name": "li" },
dataType: "json",
success: function (data) {
//var json = eval('(' + data + ')')//为什么 加eval函数,本身的问题。 由于json是以”{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。 
alert("性别:" + json.sex + ",爱好:" + json.interest);
// $("#iddiv").text(json.sex);
}
});

});
});
</script>

后台  :

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// context.Response.Write("Hello World");
request(context);
}
void request(HttpContext context) {
var name = context.Request["name"];
if (name == "li") {
string json = "{\"sex\":\"男\",\"interest\":\"篮球\" }";
context.Response.Write(json);
context.Response.End();
}
}

3.带序列化text数据,在success事件中手动解析    返回带序列化json对象

前台:

<script>
//第一种返回json字符
$(document).ready(function () {
$("#btnrq").click(function () {
$.ajax({
type: "post",
url: "Result.ashx",
data: { "name": "li" },

dataType: "text",
success: function (data) {
$("#iddiv").text(data);
var json = eval('(' + data + ')');//为什么 加eval函数,本身的问题。 由于json是以”{}”的方式来开始以及结束的,在JS中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。

var json1 =val("(" + data + ")");
//因为后台声明的字符串,又序列化之后 所以在此处理两次 (PS:偷个懒 下同)
alert("性别:" + json1.sex + ",爱好:" + json1.interest);
// $("#iddiv").text(json.sex);
}

});

});
});
</script>

后台  :

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// context.Response.Write("Hello World");
request(context);
}
void request(HttpContext context) {
var name = context.Request["name"];
if (name == "li") {
string json = "{\"sex\":\"男\",\"interest\":\"篮球\" }";
JavaScriptSerializer js = new JavaScriptSerializer();   //   ASP.NET中的JSON序列化和反序列化还可以使用JavaScriptSerializer,在System.Web.Script.Serializatioin命名空间下,需引用System.Web.Extensions.dll.
var j=js.Serialize(json);
context.Response.Write(j);
context.Response.End();
}
}

4.带序列化的json 前台自动解析:  第四种返回序列化的json对象

前台:

<script>
//第一种返回json字符
$(document).ready(function () {

$("#btnrq").click(function () {
$.ajax({
type: "post",
url: "Result.ashx",
data: { "name": "li" },

dataType: "json",
success: function (data) {
$("#iddiv").text(data);
alert("性别:" + json.sex + ",爱好:" + json.interest);
}

});

});
});
</script>

后台  :

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// context.Response.Write("Hello World");
request(context);
}
void request(HttpContext context) {
var name = context.Request["name"];
if (name == "li") {
string json = "{\"sex\":\"男\",\"interest\":\"篮球\" }";
JavaScriptSerializer js = new JavaScriptSerializer();   //   ASP.NET中的JSON序列化和反序列化还可以使用JavaScriptSerializer,在System.Web.Script.Serializatioin命名空间下,需引用System.Web.Extensions.dll.
var j=js.Serialize(json);
context.Response.Write(j);
context.Response.End();
}
}

jquery 请求返回的几种方式的更多相关文章

  1. 通过XMLHttpRequest和jQuery实现ajax的几种方式

    AJAX大家已经都知道了,是为了实现异步通讯,提高用户体验度,而将很多旧知识(XML,DOM,JavaScript,HTML,Jquery,Css……)重新融合的一个新的知识框架.而,XMLHttpR ...

  2. jquery.validate+jquery.form提交的三种方式

    原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...

  3. jQuery 实现图片放大两种方式

    jQuery 实现图片放大两种方式 一.利用css样式表实现,多用于后台显示 1.这种比较简单,利用dom元素的hover实现样式切换 <style> img{ cursor: point ...

  4. Android请求服务器的两种方式--post, get的区别

    android中用get和post方式向服务器提交请求_疯狂之桥_新浪博客http://blog.sina.com.cn/s/blog_a46817ff01017yxt.html Android提交数 ...

  5. Ajax请求数据的两种方式

    ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...

  6. jQuery编写组件的几种方式

    原文链接:https://w.cnblogs.com/xiao-xi/p/8572471.html 三种方式: 1.通过$.extend()来扩展jQuery 2.通过$.fn 向jQuery添加新的 ...

  7. jQuery绑定事件的四种方式

      jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...

  8. 使用JQuery获取对象的几种方式

    1.先讲讲JQuery的概念 JQuery首先是由一个 America 的叫什么 John Resig的人创建的,后来又很多的JS高手也加入了这个团队.其实 JQuery是一个JavaScript的类 ...

  9. struts2 添加请求后缀的3种方式

    第一种方式在struts.xml文件中添加 <constant name="struts.action.extension" value="">&l ...

随机推荐

  1. js实现选中文字 分享功能

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. titlesplit

    /** * Created by lkl on 2017/6/26. *///spark-shell --driver-class-path /home/hadoop/test/mysqljdbc.j ...

  3. [Python] 04 - os & sys module

    相当实用的一些API: Ref: https://docs.python.org/3/library/os.html from os import listdir from os.path impor ...

  4. 【class2src】Decompiler

    方法源自:https://stackoverflow.com/questions/272535/how-do-i-decompile-java-class-files 功能:给定一个.class文件, ...

  5. 一个表中的id有多个记录,把所有这个id的记录查出来,并显示共有多少条记录数

    一个表中的id有多个记录,把所有这个id的记录查出来,并显示共有多少条记录数 select id ,Count(*) from table_name group by id having count( ...

  6. windows 2008 r2 不能启用网络发现

    在win2008 R2里面,不能启用网络发现,查询资料,得知需开启一下三个服务: Function Discovery Resource Publication SSDP Discovery UPnP ...

  7. Django之ORM那些相关操作

    一般操作 看专业的官网文档,做专业的程序员! 必知必会13条 <1> all(): 查询所有结果 <2> filter(**kwargs): 它包含了与所给筛选条件相匹配的对象 ...

  8. Java 文件读写操作

    1[1]按字节读写,一次只读取一个字节,效率比较低 package bk1; import java.io.File; import java.io.FileInputStream; import j ...

  9. poj1094 Sorting It All Out【floyd】【传递闭包】【拓扑序】

    Sorting It All Out Time Limit: 1000MS   Memory Limit: 10000K Total Submissions:39731   Accepted: 139 ...

  10. ES6 import

    ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...