C# 使用jquery 中Ajax异步调用。详解。教程详解

最新推荐文章于 2025-05-16 11:09:32 发布

转载最新推荐文章于 2025-05-16 11:09:32 发布 · 1.4k 阅读

C# 专栏收录该内容

19 篇文章

订阅专栏

该博客适合初学者，介绍了两种处理方式。一是简单的Ajax异步程序，在demo1.aspx页面操作，将数据传至后台.cs代码处理；二是自定义处理后台数据，通过ajax发送请求，将参数传到一般处理程序，新建AjaxHandler.ashx文件进行后台数据处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

参考网上的例子比较容易懂的，适合我这样的初学者。

用了两种方式，一个是简单的Ajax异步程序，另一个是一般处理程序

一、这个是简单的Ajax异步程序。直接在后台处理请求。

在demo1.aspx页面操作

 $(function () {  //这个是页面初始化
            $("#btn1").click(function () {
                var txtparam1 = $("#txtParam1").val();
                var txtparam2 = $("#txtParam2").val();

                $.ajax({
                    url: "demo1.aspx/AjaxMethod",//发送到本页面后台AjaxMethod方法
                    type: "POST",
                    dataType: "json",
                    async: true,//async翻译为异步的，false表示同步，会等待执行完成，true为异步
                    contentType: "application/json; charset=utf-8",//不可少。不设置这个，json也是返不回来的

                    data: "{param1:'" + txtparam1 + "',param2:'" + txtparam2 + "'}",
                    success: function (data) {
                        $("#result").html(data.d);// d?
                    },
                    error: function () {
                        alert("请求出错处理");
                    }
                });

            });
        });

将数据传到后台.cs代码（demo1.aspx.cs）F7，在demo1.aspx.cs中AjaxMethod()方法中做数据处理

namespace AjaxDemo
{
    public partial class demo1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }

        //type方式必须是post，方法必须是静态的，方法声明要加上特性 
         //[System.Web.Services.WebMethod()]，传递的参数个数也应该和方法的参数相同。
        [System.Web.Services.WebMethod()]
        public static string AjaxMethod(string param1, string param2)
        {
            return "参数1为："+param1+"，参数2为："+param2;
        }
    }
}

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------

二、这个是自定义处理后台数据的文件。

ajax发送请求。将参数传到一般处理程序(demo1.ashx)中。

 $(function () {
            $("#btn2").click(function () {
                var params = {};//参数数组
                params.action = "GetAjaxValue";
                params.param1 = $("#txtParam1").val();
                params.param2 = $("#txtParam2").val();

                $.ajax({
                    url: "AjaxHandler.ashx",//指向一般处理程序。
                    data: params,
                    type: "POST",
                    async: true,
                    //contentType: "application/json; charset=utf-8",//加了这句，程序会无法把参数params 传到一般处理程序中。
                    dataType: "json",
                    beforeSend: function () {
                       //发送请求前执行
                    },
                    success: function (msg) {
                        if (msg.OperateResult == "success") {
                            if (msg.ResponseData.length > 0) {
                                $("#result").html(msg.ResponseData);
                            }
                        }
                    },
                    error: function (e) {
                        alert("请求出错处理");
                    },
                    complete: function () {
                    }
                });
            });
        });

2.新建一个一般处理程序AjaxHandler.ashx文件。在这里就行后台数据处理。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;//必须

namespace AjaxDemo
{
    /// <summary>
    /// AjaxHandler 的摘要说明
    /// </summary>
    public class AjaxHandler : IHttpHandler
    {
        private JavaScriptSerializer json = new JavaScriptSerializer();
        private string operateSuccess = "success";
        private string operateFailed = "false";
        public void ProcessRequest(HttpContext context)
        {
            string jsonObject = string.Empty;
            string action = context.Request["action"];
            //context.Response.ContentType = "text/plain";//服务端需要返回一段普通文本给客户端 
            context.Response.ContentType = "application/json;charset=utf-8";//服务端需要返回一段json串给客户端 

            if (action == "GetAjaxValue")
            {
                try
                {
                    string param1 = context.Request["param1"];
                    string param2 = context.Request["param2"];
                    string result = "第一个参数：" + param1 + "第一个参数：" + param2;

                    jsonObject = json.Serialize(new { OperateResult = operateSuccess, ResponseData = result });
                }
                catch (Exception e)
                {
                    jsonObject = json.Serialize(new { OperateResult = operateFailed, ResponseData = e.Message });
                }
            }
            context.Response.Write(jsonObject);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}