jquery ajax,ashx,json的用法总结

 更新时间:2014年02月12日 09:11:51   转载 作者:  
本篇文章主要是对jquery ajax,ashx,json的用法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助

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

相关文章

  • jquery插件开发模式实例详解

    jquery插件开发模式实例详解

    这篇文章主要介绍了jquery插件开发模式,结合实例形式详细分析了jQuery插件三种开发方式实现方法与相关操作技巧,需要的朋友可以参考下
    2019-07-07
  • jQuery+CSS3实现四种应用广泛的导航条制作实例详解

    jQuery+CSS3实现四种应用广泛的导航条制作实例详解

    这篇文章主要介绍了jQuery+CSS3实现多种类型的导航条制作实例详解的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-09-09
  • NodeJS使用jQuery选择器操作DOM

    NodeJS使用jQuery选择器操作DOM

    这篇文章主要介绍了NodeJS使用jQuery选择器操作DOM的相关资料,需要的朋友可以参考下
    2015-02-02
  • jQuery File Upload文件上传插件使用详解

    jQuery File Upload文件上传插件使用详解

    jQuery File Upload 是一个Jquery文件上传组件,支持多文件上传、取消、删除,上传前缩略图预览、列表显示图片大小,支持上传进度条显示;支持各种动态语言开发的服务器端.这篇文章主要介绍了jQuery File Upload文件上传插件使用,需要的朋友可以参考下
    2016-12-12
  • Jquery知识点二 jquery下对数组的操作

    Jquery知识点二 jquery下对数组的操作

    众所周知,Jquery是对JavaScript的一种高效的封装,所以Jquery要操作的数组即是JavaScript中的数组,在JavaScript中我们使用for以及for-in进行数组的操作,而在Jquery中则使用$.map()、$.each()来操作数组
    2011-01-01
  • jQuery实现字符串全部替换的方法

    jQuery实现字符串全部替换的方法

    这篇文章主要介绍了jQuery实现字符串全部替换的方法,结合实例形式对比分析了使用Replace进行替换的方法及使用正则进行全部替换的相关操作技巧,需要的朋友可以参考下
    2016-12-12
  • 全面解析jQuery $(document).ready()和JavaScript onload事件

    全面解析jQuery $(document).ready()和JavaScript onload事件

    这篇文章主要介绍了全面解析jQuery $(document).ready()和JavaScript onload事件的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • Jquery实战_读书笔记1—选择jQuery

    Jquery实战_读书笔记1—选择jQuery

    近期公司积极组织我们这些开发人员学习进步,督促我们学习更多的技术来提高自己。为此我选择了jQuery作为我学习的方向,同时我也是想将我的学习心得分享给大家,以后我会不断的更新一系列jQuery方面的学习纪要,帮助大家学习。
    2010-01-01
  • 一个JQuery写的点击上下滚动的小例子

    一个JQuery写的点击上下滚动的小例子

    分享一个JQuery写的点击上下滚动的小例子,学习jquery的朋友可以参考下。
    2011-08-08
  • jQuery实现字符串按指定长度加入特定内容的方法

    jQuery实现字符串按指定长度加入特定内容的方法

    这篇文章主要介绍了jQuery实现字符串按指定长度加入特定内容的方法,实例分析了jQuery操作字符串的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03

最新评论