jquery ajax,ashx,json的用法總結(jié)
jquery提供的簡(jiǎn)化版的ajax調(diào)用方法通常如下:
function post() {
$("#divWait").show();
$("#btnPost").attr("disabled", "disabled");
$.post("../PostIt.ashx",
{
msgContent: $("#msgContent").val()
},
function (data) {
if (data.indexOf('OK') > -1) {
alert(data);
}
else {
}
$("#divWait").hide();
$("#btnPost").attr("disabled", "");
});
}
在開發(fā)的時(shí)候,要接受json格式的返回值時(shí),上面的方法貌似不能行,上面的方法貌似接受的是text的文本行。因此,采用jQuery的底層Ajax實(shí)現(xiàn)方法。
該方法參數(shù)也很多,具體可看幫助文檔。本人的常規(guī)用法
function doPostAjax(){
$("#divWait").show();
$("#btnPost").attr("disabled", "disabled");
$.ajax({
url: '../PostIt.ashx',
type: 'POST',
dataType: 'json',
data: { msgContent: $("#msgContent").val() },
timeout: 60000,
error: function (XMLHttpRequest, textStatus, errorThrown) {//請(qǐng)求錯(cuò)誤 時(shí)執(zhí)行的方法
alert("error!" + errorThrown);
$("#divWait").hide();
$("#btnPost").attr("disabled", "");
},
success: function (data, txtSataus) {//請(qǐng)求成功時(shí)執(zhí)行的方法
showContent(data.content, data.createdate);
$("#divWait").hide();
$("#btnPost").attr("disabled", "");
}
});
}
在ashx代碼段,要設(shè)置好返回的格式。
context.Response.ContentType = "application/json";
如果是返回的html或者text的話可以如下寫法
context.Response.ContentType = "text/plain";
如果ajax方法中設(shè)置的返回值是json時(shí),ashx代碼返回的格式必須是json格式的數(shù)據(jù)。
把一個(gè)對(duì)象轉(zhuǎn)換成json格式,常用方法就是采用開源的第三方類庫json.net,Newtonsoft.Json.dll.
JsonConvert.SerializeObject方法就可以轉(zhuǎn)換了。返回json格式后,jquery就可以采用XXX.xxx的方式獲取值了。
JsonConvert在處理datetime格式的時(shí)候,會(huì)返回類似1198908717056的絕對(duì)值,因此,在處理datetime的時(shí)候,要做一下轉(zhuǎn)換。具體語句如下:
IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
//這里使用自定義日期格式,如果不使用的話,默認(rèn)是ISO8601格式
timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
string output = JsonConvert.SerializeObject(m, Newtonsoft.Json.Formatting.Indented, timeConverter);
此處順便提一下,javascript對(duì)json格式的數(shù)據(jù)有著天生的處理能力,非常好的兼容json格式數(shù)據(jù)。
舉個(gè)例子:
function pppp() {
var person = { "name": "jack", "age": 24,"sex": true };
alert(person.name);
alert(person.age);
alert(person.sex);
}
這樣的代碼可以直接寫出來,在vs2010的代碼編輯器中還可以有代碼提示。很強(qiáng)大。
ashx完整代碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Threading;
using Newtonsoft.Json;
using Newtonsoft.Json.Converters;
namespace nnn
{
/// <summary>
/// PostIt 的摘要說明
/// </summary>
public class PostIt : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "application/json";
try
{
string msgContent = context.Request["msgContent"] ?? "";
ModelContent m = new ModelContent()
{
author = "",
categoryid = -1,
title = "",
content = msgContent,
datetime = DateTime.Now,
key = "",
createdate = DateTime.Now,
lastmodifydate = DateTime.Now,
ip = context.Request.UserHostAddress
};
//BLLContent bll = new BLLContent();
//bll.Add(m);
IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
//這里使用自定義日期格式,如果不使用的話,默認(rèn)是ISO8601格式
timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
string output = JsonConvert.SerializeObject(m, Newtonsoft.Json.Formatting.Indented, timeConverter);
context.Response.Write(output);
}
catch (Exception ex)
{
context.Response.Write(ex.Message);
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
相關(guān)文章
jQuery插件echarts實(shí)現(xiàn)的去掉X軸、Y軸和網(wǎng)格線效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件echarts實(shí)現(xiàn)的去掉X軸、Y軸和網(wǎng)格線效果,結(jié)合實(shí)例形式分析了echarts插件繪制表格圖及圖形相關(guān)屬性設(shè)置操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03jQuery的實(shí)現(xiàn)原理的模擬代碼 -4 重要的擴(kuò)展函數(shù) extend
在上兩篇文章中,我們看到每次要通過 jQuery 的原型增加共享方法的時(shí)候,都需要通過 jQuery.fn 一個(gè)個(gè)進(jìn)行擴(kuò)展,非常麻煩.2010-08-08jQuery實(shí)現(xiàn)動(dòng)態(tài)添加和刪除input框代碼實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)動(dòng)態(tài)添加和刪除input框,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03jQuery插件實(shí)現(xiàn)靜態(tài)HTML驗(yàn)證碼校驗(yàn)
這篇文章主要介紹了jQuery插件實(shí)現(xiàn)靜態(tài)HTML驗(yàn)證碼校驗(yàn),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-11-11基于jQuery實(shí)現(xiàn)點(diǎn)擊同時(shí)更改兩個(gè)iframe的網(wǎng)址
最近寫了兩個(gè)管理后臺(tái)的前端頁面,其中有一個(gè)管理后臺(tái),左側(cè)菜單導(dǎo)航和右側(cè)內(nèi)容頁是兩個(gè)iframe,需求是,點(diǎn)擊上面的主導(dǎo)航時(shí),左側(cè)iframe和右側(cè)iframe調(diào)用不同的鏈接.2010-07-07jQuery實(shí)現(xiàn)簡(jiǎn)單的列表式導(dǎo)航菜單效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單的列表式導(dǎo)航菜單效果代碼,涉及jquery操作鼠標(biāo)事件及頁面元素樣式動(dòng)態(tài)變換的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08快速解決jquery.touchSwipe左右滑動(dòng)和垂直滾動(dòng)條沖突
這篇文章主要介紹了快速解決jquery.touchSwipe左右滑動(dòng)和垂直滾動(dòng)條沖突問題,感興趣的小伙伴們可以參考一下2016-04-04jquery實(shí)現(xiàn)預(yù)覽提交的表單代碼分享
這篇文章主要介紹了jquery實(shí)現(xiàn)預(yù)覽提交的表單代碼,需要的朋友可以參考下2014-05-05