jquery ajax,ashx,json的用法总结


Posted in Javascript onFebruary 12, 2014

jquery提供的简化版的ajax调用方法通常如下:

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

在开发的时候,要接受json格式的返回值时,上面的方法貌似不能行,上面的方法貌似接受的是text的文本行。因此,采用jQuery的底层Ajax实现方法。

该方法参数也很多,具体可看帮助文档。本人的常规用法

    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) {//请求错误 时执行的方法 
                    alert("error!" + errorThrown); 
                    $("#divWait").hide(); 
                    $("#btnPost").attr("disabled", ""); 
                }, 
                success: function (data, txtSataus) {//请求成功时执行的方法 
                    showContent(data.content, data.createdate); 
                    $("#divWait").hide(); 
                    $("#btnPost").attr("disabled", ""); 
                }
                }); 
        }

在ashx代码段,要设置好返回的格式。

context.Response.ContentType = "application/json";

如果是返回的html或者text的话可以如下写法

context.Response.ContentType = "text/plain";

如果ajax方法中设置的返回值是json时,ashx代码返回的格式必须是json格式的数据。
把一个对象转换成json格式,常用方法就是采用开源的第三方类库json.net,Newtonsoft.Json.dll.

JsonConvert.SerializeObject方法就可以转换了。返回json格式后,jquery就可以采用XXX.xxx的方式获取值了。

JsonConvert在处理datetime格式的时候,会返回类似1198908717056的绝对值,因此,在处理datetime的时候,要做一下转换。具体语句如下:

IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();          
//这里使用自定义日期格式,如果不使用的话,默认是ISO8601格式           
timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
string output = JsonConvert.SerializeObject(m, Newtonsoft.Json.Formatting.Indented, timeConverter);

此处顺便提一下,javascript对json格式的数据有着天生的处理能力,非常好的兼容json格式数据。

举个例子:

    function pppp() { 
           var person = { "name": "jack", "age": 24,"sex": true }; 
           alert(person.name); 
           alert(person.age); 
           alert(person.sex); 
           }

这样的代码可以直接写出来,在vs2010的代码编辑器中还可以有代码提示。很强大。

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();          
                //这里使用自定义日期格式,如果不使用的话,默认是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; 
            } 
        } 
    } 
}
Javascript 相关文章推荐
JavaScript仿静态分页实现方法
Aug 04 Javascript
jQuery网页版打砖块小游戏源码分享
Aug 20 Javascript
js实现3D图片逐张轮播幻灯片特效代码分享
Sep 09 Javascript
jquery实现定时自动轮播特效
Dec 10 Javascript
jQuery.cookie.js使用方法及相关参数解释
Mar 06 Javascript
基于JavaScript实现选项卡效果
Jul 21 Javascript
eslint 的三大通用规则详解
May 16 Javascript
mpvue 页面预加载新增preLoad生命周期的两种方式
Oct 17 Javascript
Vue生命周期activated之返回上一页不重新请求数据操作
Jul 26 Javascript
我所理解的JavaScript中的this指向
Sep 04 Javascript
vue element实现表格合并行数据
Nov 30 Vue.js
JavaScript继承的三种方法实例
May 12 Javascript
Jquery中ajax方法data参数的用法小结
Feb 12 #Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
Feb 12 #Javascript
Jquery中国地图热点效果-鼠标经过弹出提示层信息的简单实例
Feb 12 #Javascript
JavaScript cookie的设置获取删除详解
Feb 11 #Javascript
JavaScript新窗口与子窗口传值详解
Feb 11 #Javascript
jquery绑定事件不生效的解决方法
Feb 11 #Javascript
JS将制定内容复制到剪切板示例代码
Feb 11 #Javascript
You might like
php数组函数序列之array_unshift() 在数组开头插入一个或多个元素
2011/11/07 PHP
php中用memcached实现页面防刷新功能
2014/08/19 PHP
php判断访问IP的方法
2015/06/19 PHP
PHP使用pdo连接access数据库并循环显示数据操作示例
2018/06/05 PHP
php输出形式实例整理
2020/05/05 PHP
jQuery 插件 将this下的div轮番显示
2009/04/09 Javascript
JQuery 动画卷页 返回顶部 动画特效(兼容Chrome)
2010/02/15 Javascript
js中的string.format函数代码
2020/08/11 Javascript
js string 转 int 注意的问题小结
2013/08/15 Javascript
javascript中arguments,callee,caller详解
2016/03/16 Javascript
bootstrap折叠调用collapse()后data-parent不生效的快速解决办法
2017/02/23 Javascript
利用js定义一个导航条菜单
2017/03/14 Javascript
jquery dataTable 获取某行数据
2017/05/05 jQuery
websocket+node.js实现实时聊天系统问题咨询
2017/05/17 Javascript
vue.js vue-router如何实现无效路由(404)的友好提示
2017/12/20 Javascript
react配合antd组件实现的管理系统示例代码
2018/04/24 Javascript
微信小程序实现发送验证码按钮效果
2018/12/20 Javascript
mpvue性能优化实战技巧(小结)
2019/04/17 Javascript
Angular Excel 导入与导出的实现代码
2019/04/17 Javascript
express + jwt + postMan验证实现持久化登录
2019/06/05 Javascript
JavaScript动态添加数据到表单并提交的几种方式
2019/06/26 Javascript
[01:46]TI4西雅图DOTA2前线报道 中国选手抱团调时差
2014/07/08 DOTA
[56:24]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#1Liquid VS MVP.Phx第二局
2016/03/04 DOTA
Python中无限元素列表的实现方法
2014/08/18 Python
Python 中的 else详解
2016/04/23 Python
基于python 字符编码的理解
2017/09/02 Python
Python多线程编程之多线程加锁操作示例
2018/09/06 Python
树莓派用python中的OpenCV输出USB摄像头画面
2019/06/22 Python
python或C++读取指定文件夹下的所有图片
2019/08/31 Python
Python中的单下划线和双下划线使用场景详解
2019/09/09 Python
python实现快递价格查询系统
2020/03/03 Python
python上selenium的弹框操作实现
2020/07/13 Python
用Python实现定时备份Mongodb数据并上传到FTP服务器
2021/01/27 Python
英国女性时尚精品店:THE DRESSING ROOM
2018/05/23 全球购物
2019年分享net面试的经历和题目
2016/08/07 面试题
建筑工程材料员岗位职责
2015/04/11 职场文书