zoukankan      html  css  js  c++  java
  • ajax访问服务器返回json格式

    使用ajax访问服务器返回多条数据,比如返回一个表中的所有数据,页面该如何处理呢?如何获取数据呢?一直不会用ajax返回json格式,今天研究了下,分享给大家~

    首先需要引用服务,点击项目右键,添加引用

    创建一般处理程序 CityHandler_json.ashx,添加引用using Newtonsoft.Json;

    <%@ WebHandler Language="C#" Class="CityHandler_json" %>
    
    using System;
    using System.Web;
    using Newtonsoft.Json;//添加引用
    public class CityHandler_json : IHttpHandler {
        
        public void ProcessRequest (HttpContext context) {
            context.Response.ContentType = "text/plain";
    
    
            string sql = "select * from city ";
            System.Data.DataTable dt = SqlHelper.ExecuteTable(sql);
            if (dt != null && dt.Rows.Count > 0)
            {
                string Json = JsonConvert.SerializeObject(dt);//序列化为json格式
                context.Response.Write(Json);
               
            }
           
            context.Response.End();
        }
     
        public bool IsReusable {
            get {
                return false;
            }
        }
    
    }
    后台返回json代码

    前台获取

     <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function () {
                $.ajax({
                    type: "post",
                    url: "CityHandler_json.ashx",
                    success: function (data) {
                        // alert(data);
                        var json = eval(data);//数组
                        $.each(json, function (index, item) {
                        //循环获取数据
                            var name = json[index].jc;
                            var id = json[index].cityID;
                            $("#cityInfo").html($("#cityInfo").html() + "<tr><td>" + name + "</td><td>" + id + "</td></tr>");
                        });
                    }
    
                });
    
            });
        </script>
    前台ajax方法

    html页面

    <body>
        
        <form id="form1" runat="server">
        <div id="text">
        <table border="1px;" id="cityInfo">
        </table>
        </div>
        </form>
    </body>
    页面html
  • 相关阅读:
    面向对象中一些容易混淆的概念
    day12作业
    day10作业
    day09作业
    Where与Having的区别
    排序算法之快速排序
    排序算法之冒泡排序
    jQuery中的100个技巧
    用node.js给图片加水印
    代码高亮美化插件-----SyntaxHighlighter
  • 原文地址:https://www.cnblogs.com/chenlihong-886/p/6150304.html
Copyright © 2011-2022 走看看