$.ajax() + ashx

 

HtmlPage1.html

 

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        $(function () {
            /*
                Handler1.ashx 返回文本:
                context.Response.ContentType = "text/plain";
            */
            // 方法一：
            $.ajax({
                type: "POST",
                url: "Handler1.ashx",
                /*发送到服务器的参数*/
                //data: "name=John&location=Boston",
                data: { name: "中文姓名", location: "Boston" },
                success: function (msg) {
                    //alert("Data Saved: " + msg);

                    /*返回字符串转化为js对象*/
                    //var data = eval("(" + msg + ")");
                    var data = $.parseJSON(msg); //推荐
                    for (var i = 0; i < data.length; i++) {
                        $("body").append("<p>" + data[i].key + " | " + data[i].name + " | " + data[i].location + "</p>");
                    }
                }
            });
            // 方法二：
            $.ajax({
                type: "POST",
                /*返回JSON数据*/
                dataType: "JSON",
                url: "Handler1.ashx",
                /*发送到服务器的参数*/
                data: { name: "John", location: "Boston" },
                success: function (msg) {
                    //遍历返回JSON的数据
                    for (var i = 0; i < msg.length; i++) {
                        $("body").append("<h1>" + msg[i].key + " | " + msg[i].name + " | " + msg[i].location + "</h1>");
                    }
                }
            });

            /*
                Handler1.ashx 返回JSON数据:
                context.Response.ContentType = "application/json";
            */
            // 方法三：
            //$.ajax({
            //    type: "POST",
            //    url: "Handler1.ashx",
            //    /*发送到服务器的参数*/
            //data: { name: "John", location: "Boston" },
            //success: function (msg) {
            //    //遍历返回JSON的数据
            //    for (var i = 0; i < msg.length; i++) {
            //        $("body").append("<h1>" + msg[i].key + " | " + msg[i].name + " | " + msg[i].location + "</h1>");
            //    }
            //}
            //});
        });
    </script>
</head>
<body>
</body>
</html>

　　

 

 

Handler1.ashx

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;
namespace _6_3_jquery_ajax
{
    /// <summary>
    /// Handler1 的摘要说明
    /// </summary>
    public class Handler1 : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            //返回文本
            context.Response.ContentType = "text/plain";
            //返回JSON数据:
            context.Response.ContentType = "application/json";

            string name = context.Request["name"];
            string location = context.Request["location"];

            Person p1 = new Person();
            p1.key = 1;
            p1.name = name;
            p1.location = location;

            Person p2 = new Person();
            p2.key = 2;
            p2.name = "yokin";
            p2.location = "linyongqin";

            List<Person> list = new List<Person>();
            list.Add(p1);
            list.Add(p2);

            JavaScriptSerializer jss = new JavaScriptSerializer();
            string jssStr = jss.Serialize(list);
            context.Response.Write(jssStr);
        }

        public class Person
        {
            public int key { get; set; }
            public string name { get; set; }
            public string location { get; set; }  
        }

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

　　

 

posted @ 2015-06-24 21:42  linyongqin  阅读(221)  评论(0)    收藏  举报