jQuery $.post json用法 实例下载

jQuery.post(url,[data],[callback])

通过远程 HTTP POST 请求载入信息。

这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。

---

 

返回值

XMLHttpRequest

参数

url (String) : 发送请求地址。

data (Map) : (可选) 待发送 Key/value 参数。

callback (Function) : (可选) 发送成功时回调函数。

 

 实例：利用$.post()计算两个数的和及乘（返回json）的结果。

 

index.html页面JS代码片段：

 

        $("#btn_1").click(function(){
            //验证
            if ($("#txt_1").val()=='' || $("#txt_2").val()=='')
            {
                alert('请输入要计算的值');
                return false;
            }
            //向add.ashx请求结果
            $.post('Enumerate/add.ashx',{ 
                //参数一
                num1: $('#txt_1').val(), 
                //参数二
                num2: $("#txt_2").val() 
            }, 
            //回调函数
            function(theback) 
            {
                //输出结果
                $("#span_1").text(theback);
            },
            //返回类型
            "text"
            );
        });

 

 

add.ashx页面代码（计算并返回结果）：

 

<%@ WebHandler Language="C#" Class="add" %>

using System;
using System.Web;

public class add : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        //返回类型
        context.Response.ContentType = "text/html";
        //接收参数
        int iNum1, iNum2;
        int.TryParse(context.Request["num1"].ToString(),out iNum1);
        int.TryParse(context.Request["num2"].ToString(),out iNum2);
        //计算并返回结果
        context.Response.Write("结果:"+(iNum1+iNum2).ToString());
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }

}

 

 

$.post()返回json方式用法：

 

$("#btn_2").click(function(){
            //验证
            if ($("#txt_3").val()=='' || $("#txt_4").val()=='')
            {
                alert('请输入要计算的值');
                return false;
            }
            //向multiply.ashx请求结果
            $.post('Enumerate/multiply.ashx',{ 
                //参数一
                num1: $('#txt_3').val(), 
                //参数二
                num2: $("#txt_4").val() 
            },
            //回调函数 
            function(theback) 
            {
                //输出结果
                $("#div_2").html('第一个数：'+theback.num1+'<br />'+'第二个数：'+theback.num2+'<br />'+'算法类型：'+theback.type+'<br />'+'计算结果：'+theback.result);
            },
            //返回类型
            "json"
            );
        });

 

C#返回json方式代码（multiply.ashx页面）：

 

        context.Response.ContentType = "application/json";
        int iNum1, iNum2;
        int.TryParse(context.Request["num1"].ToString(), out iNum1);
        int.TryParse(context.Request["num2"].ToString(), out iNum2);

        context.Response.Write("{num1: '" + iNum1.ToString() + "',num2: '" + iNum2.ToString() + "',type: 'enumerate',result: '" + (iNum1 * iNum2).ToString() + "'}");

 

 

下载这个实例源代码：download