需要Newtonsoft.Json.dll插件
TableShow.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TableShow.aspx.cs" Inherits="TableShow" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="jquery-1.9.1.min.js" type="text/javascript"></script> <style type="text/css"> #TB { 186px; height: 54px; } .style1 { height: 26px; } </style> </head> <body> <form id="form1" runat="server"> <div> <table id="TB" align="center" border="1" bordercolor="#0099CC"> <tr> <th class="style1"> 工号 </th> <th class="style1"> 用户名 </th> <th class="style1"> 密码 </th> <th class="style1"> 角色 </th> </tr> </table> </div> <div> <center> <button type="button"> Click me</button> </center> </div> </form> <script type="text/javascript"> $(document).ready(function () { $("button").click(function () { $.ajax({ type: "post", url: "Handler.ashx", data: {}, success: function (result) { var items = eval(result); var content = ""; for (var i = 0; i < items.length; i++) { content = $("<tr><td>" + items[i].userid + "</td><td>" + items[i].username + "</td><td>" + items[i].password + "</td><td>" + items[i].role + "</td></tr>"); $("#TB tbody").append(content); } } }); }); }); </script> </body> </html>
Handler.ashx
<%@ WebHandler Language="C#" Class="Handler" %> using System; using System.Web; using Newtonsoft.Json; using Newtonsoft.Json.Converters; using System.Data; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; DB db = new DB(); DataTable dt = db.reDt("select userid,username,password,role from userInfo"); string result = JsonConvert.SerializeObject(dt, new DataTableConverter()); context.Response.Write(result); context.Response.End(); } public bool IsReusable { get { return false; } } }