求解ajax获取后台json数据，要如何循环展示在div里面
[问题点数：80分，结帖人qq_]
本版专家分：0
结帖率 93.75%
CSDN今日推荐
本版专家分：395997
2017年 总版技术专家分年内排行榜第三
2013年 总版技术专家分年内排行榜第五
2018年5月 总版技术专家分月排行榜第一2018年4月 总版技术专家分月排行榜第一2018年2月 总版技术专家分月排行榜第一2017年8月 总版技术专家分月排行榜第一
2018年3月 总版技术专家分月排行榜第二2017年11月 总版技术专家分月排行榜第二2016年2月 总版技术专家分月排行榜第二2014年2月 总版技术专家分月排行榜第二2013年4月 总版技术专家分月排行榜第二
本版专家分：2403
匿名用户不能发表回复！|
CSDN今日推荐所有回答(10)
你data里面的数据结构是怎么样的？data.d，是一个数组结构，data.d[0].name才有值...&& 你的each里面的value是遍历的data的每一个元素，，结构好像不对。。&&& value[0].name
不知道你的后台设置了响应体的类型没：content-type:application/json
或者在前台用JSON.parse(data)转成有效的json格式。
园豆：1124
$.each();这个方法是 网页中存在对象，才可以用。应该用 for循环吧
你在alert(data.d);后面加上一句话：
data.d = eval(data.d);
园豆：13984
园豆：13984
园豆：13984
园豆：13984
园豆：13984
首先你不是标准的json，取出的string用JSON.parse(data.d)之后console.log(),看看是不是object数组
园豆：2267
后天必须用反斜杠表示双引号，规范json的格式。或者，在前台使用eval("("+result+")")转换成一个JavaScript对象。
你这返回的不是标准的json格式，json格式是以{}包括的，你这多了[]，你吧[]去掉然后JSON.parse试试
园豆：1953
chartJson["M1"] 试一下这种写法
你这里的循环用的是$.each(data,function(n,value)){}
看看这个你循环的是data ，而你的数据在data.d中，当然找不到了 ，
你换成$.each(data.d,function(n,value)){} 试试看！ 推荐技术类公众号CodeL
var row = eval(data); for (var i = 0; i & row. i++) { 　　var addOption = document.createElement("option"); 　　addOption.text = row[i]["model"]; 　　addOption.value = row[i]["model"]; 　　document.getElementById("ddlModel").add(addOption); }
清除回答草稿
&&&您需要以后才能回答，未注册用户请先。&!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"&
&title&&/title&
&script src="JS/jquery-1.8.0.min.js" type="text/javascript"&&/script&
&script type="text/javascript"&
$(function () {
url: 'jsondata.ashx',
type: 'GET',
dataType: 'json',
timeout: 1000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
$("#list").html('加载中...');
function erryFunction() {
alert("error");
function succFunction(tt) {
$("#list").html('');
//eval将字符串转成对象数组
//var json = { "id": "10086", "uname": "zhangsan", "email": "" };
//json = eval(json);
//alert("===json:id=" + json.id + ",uname=" + json.uname + ",email=" + json.email);
var json = eval(tt); //数组
$.each(json, function (index, item) {
//循环获取数据
var name = json[index].N
var idnumber = json[index].IdN
var sex = json[index].S
$("#list").html($("#list").html() + "&br&" + name + " - " + idnumber + " - " + sex + "&br/&");
&ul id="list"&
&%@ WebHandler Language="C#" Class="jsondata" %&
using System.W
using System.Web.Script.S
using System.IO;
using System.T
using System.Collections.G
using Newtonsoft.J
using System.D
public class jsondata : IHttpHandler {
public void ProcessRequest(HttpContext context)
context.Response.ContentType = "text/plain";
string JsonStr = JsonConvert.SerializeObject(CreateDT());
context.Response.Write(JsonStr);
context.Response.End();
#region 创建测试数据源
//创建DataTable
protected DataTable CreateDT()
DataTable tblDatas = new DataTable("Datas");
//tblDatas.Columns.Add("ID", Type.GetType("System.Int32"));
//tblDatas.Columns[0].AutoIncrement =
//tblDatas.Columns[0].AutoIncrementSeed = 1;
//tblDatas.Columns[0].AutoIncrementStep = 1;
tblDatas.Columns.Add("IdNumber", Type.GetType("System.String"));
tblDatas.Columns.Add("Name", Type.GetType("System.String"));
tblDatas.Columns.Add("BirthDate", Type.GetType("System.String"));
tblDatas.Columns.Add("Sex", Type.GetType("System.String"));
tblDatas.Columns.Add("Wage", Type.GetType("System.Decimal"));
tblDatas.Columns.Add("Bonus", Type.GetType("System.Decimal"));
//统计列开始
tblDatas.Columns.Add("NeedPay", Type.GetType("System.String"), "Wage+Bonus");
//统计列结束
tblDatas.Columns.Add("Address", Type.GetType("System.String"));
tblDatas.Columns.Add("PostCode", Type.GetType("System.String"));
//设置身份证号码为主键
tblDatas.PrimaryKey = new DataColumn[] { tblDatas.Columns["IdNumber"] };
tblDatas.Rows.Add(new object[] { "00", "张三", "1982", "0", 3000, 1000, null, "深圳市", "518000" });
tblDatas.Rows.Add(new object[] { "01", "李四", "1983", "1", 3500, 1200, null, "深圳市", "518000" });
tblDatas.Rows.Add(new object[] { "02", "王五", "1984", "1", 4000, 1300, null, "深圳市", "518000" });
tblDatas.Rows.Add(new object[] { "03", "赵六", "1985", "0", 5000, 1400, null, "深圳市", "518000" });
tblDatas.Rows.Add(new object[] { "04", "牛七", "1986", "1", 6000, 1500, null, "深圳市", "518000" });
return tblD
#endregion
public bool IsReusable
return false;
&script type="text/javascript"&
$(function () {
url: 'jsondata.ashx',
type: 'GET',
dataType: 'json',
timeout: 1000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
$("#list").html('加载中...');
function erryFunction() {
alert("error");
function succFunction(tt) {
$("#list").html('');
//eval将字符串转成对象数组
//var json = { "id": "10086", "uname": "zhangsan", "email": "" };
//json = eval(json);
//alert("===json:id=" + json.id + ",uname=" + json.uname + ",email=" + json.email);
var json = eval(tt); //数组
$.each(json, function (index, item) {
//循环获取数据
var Key = json[index].
var Info = json[index].
var idnumber = json[index].IdN
var sex = json[index].S
$("#list").html($("#list").html() + "&br&" + Key + "----" + Info.name); //+ " - " + idnumber + " - " + sex + "&br/&");
&%@ WebHandler Language="C#" Class="jsondata" %&
using System.W
using System.Web.Script.S
using System.IO;
using System.T
using System.C
using System.Collections.G
using System.D
public class jsondata : IHttpHandler {
public void ProcessRequest(HttpContext context)
context.Response.ContentType = "text/plain";
context.Response.Cache.SetNoStore();
string data = "[{\"key\":\"1\",\"info\":{\"name\":\"222\",\"age\":\"333\",\"sex\":\"444\"}},{\"key\":\"2\",\"info\":{\"name\":\"999\",\"age\":\"000\",\"sex\":\"111\"}}]";
context.Response.Write(new JavaScriptSerializer().Serialize(data));
public bool IsReusable
return false;
&%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2013.aspx.cs" Inherits="Test2013" %&
&!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="JS/jquery-1.8.0.min.js" type="text/javascript"&&/script&
&script type="text/javascript"&
function GetPara(o) {
var sortid = $(o).val();
url: 'GetPara.ashx?type=get&sortid=' + sortid,
type: 'GET',
dataType: 'json',
timeout: 3000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
$("#list").html('加载中...');
function erryFunction() {
alert("error");
function succFunction(tt) {
$("#list").html('');
var json = eval(tt); //数组
$.each(json, function (index, item) {
//循环获取数据
var Id = json[index].
var Name = json[index].
$("#list").html($("#list").html() + "&br&" + Name + "&input type='text' id='" + Id + "' /&&br/&");
function SavePara() {
var parameter = {};
$("#list input:text").each(function () {
var key = $(this).attr("id");
var value = $(this).val();
parameter[key] =
url: 'GetPara.ashx?type=save',
type: 'POST',
dataType: 'json',
data: parameter,
timeout: 3000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
function erryFunction() {
function succFunction(tt) {
&form id="form1" runat="server"&
&asp:DropDownList ID="ddl1" runat="server" onchange="GetPara(this)"&
&/asp:DropDownList&
&ul id="list"&&/ul&
&input type="button" value="保存数据" onclick="SavePara()" /&
&%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2013.aspx.cs" Inherits="Test2013" %&
&!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="JS/jquery-1.8.0.min.js" type="text/javascript"&&/script&
&script type="text/javascript"&
function GetPara(o) {
var sortid = $(o).val();
url: 'GetPara.ashx?type=get&sortid=' + sortid,
type: 'GET',
dataType: 'json',
timeout: 3000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
$("#list").html('加载中...');
function erryFunction() {
alert("error");
function succFunction(tt) {
$("#list").html('');
var json = eval(tt); //数组
$.each(json, function (index, item) {
//循环获取数据
var Id = json[index].
var Name = json[index].
$("#list").html($("#list").html() + "&br&" + Name + "&input type='text' id='" + Id + "' /&&br/&");
function SavePara() {
var parameter = {};
$("#list input:text").each(function () {
var key = $(this).attr("id");
var value = $(this).val();
parameter[key] =
url: 'GetPara.ashx?type=save',
type: 'POST',
dataType: 'json',
data: parameter,
timeout: 3000,
cache: false,
beforeSend: LoadFunction, //加载执行方法
error: erryFunction,
//错误执行方法
success: succFunction //成功执行方法
function LoadFunction() {
function erryFunction() {
function succFunction(tt) {
&form id="form1" runat="server"&
&asp:DropDownList ID="ddl1" runat="server" onchange="GetPara(this)"&
&/asp:DropDownList&
&ul id="list"&&/ul&
&input type="button" value="保存数据" onclick="SavePara()" /&
&%@ WebHandler Language="C#" Class="GetPara" %&
using System.W
using System.D
using System.Collections.G
using System.Web.Script.S
public class GetPara : IHttpHandler {
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
string SortId = context.Request["sortid"];
string Type = context.Request["type"];
if (Type=="get")
if (!string.IsNullOrEmpty(SortId))
DataTable dt = MSCL.SqlHelper.GetDataTable("select * from PR_PRODUCTPARAS where sortid='" + SortId + "' ");
List&Paras& list = new List&Paras&();
for (int i = 0; i & dt.Rows.C i++)
Paras a = new Paras();
a.id = dt.Rows[i]["PARAID"].ToString();
a.name = dt.Rows[i]["PARANAME"].ToString();
list.Add(a);
context.Response.Write(new JavaScriptSerializer().Serialize(list));
else if (Type == "save")
//反序列化json
System.IO.Stream stream = context.Request.InputS
System.IO.StreamReader sr = new System.IO.StreamReader(stream, System.Text.Encoding.GetEncoding("UTF-8"));
string sJson = sr.ReadToEnd();
if (sJson.Contains("&"))
string[] sArr = sJson.Split('&');
for (int i = 0; i & sArr.L i++)
string[] sArr1 = sArr[i].Split('=');
object id = sArr1[0];
object value = sArr1[1];
public bool IsReusable {
return false;
public struct Paras
public string
public string
阅读(...) 评论()博客分类：
下面是几种转换成json格式的方法：
List --& json:
List&Student& list = new ArrayList&Student&();
for (int i = 0; i & stus. i++) {
list.add(i);
JSONArray jsonArray = JSONArray.fromObject(stus);
System.out.println(jsonArray);
对象(Student)--&json:
Student student = new Student();
student.setAge(18);
student.setName("zhangsan");
JSONObject jsonObject = JSONObject.fromObject(student);
System.out.println(jsonObject);
List&Student& --&json
Student[] stus = new Student[5];
List&Student& stuList = new ArrayList&Student&();
for (int i = 0; i & stus. i++) {
stus[i] = new Student();
stus[i].setAge(20);
stus[i].setName("张三" + i);
stuList.add(stus[i]);
JSONObject jsonObjectFromMap = JSONObject.fromObject(stuList);
System.out.println(jsonObjectFromMap);
举例：从数据库中查询出一组数据，用ajax传到页面上，并解析生成下拉列表项
Action中：
// 获得传过来的机构ID
String org_id = request.getParameter("org_id");
Connection con = ConnectionFactory.getInstance().getConnection();
Statement pst =
ResultSet rs =
String sql = "";
sql = " select c.group_ID,c.group_name
from groupinfo c where c.group_ID!='"
+ "' start with c.group_ID='"
+ "' Connect by prior c.group_ID = c.parent_ID";
pst = con.createStatement();
rs = pst.executeQuery(sql);
JSONArray arr = new JSONArray();
while (rs.next()) {
JSONObject json = new JSONObject();
json.put("GroupId", rs.getString("group_ID"));
json.put("GroupName", rs.getString("group_name"));
arr.add(json);
PrintWriter out = response.getWriter();
out.print(arr.toString());
页面中的获取传过来的list,并进行遍历，生成下拉列表项
function change(obj){
var selectValue=document.getElementById('org_id').options[document.getElementById('org_id').selectedIndex].
document.getElementById("selectValue").value=selectV
//window.location = "&%//=request.getContextPath() %&//statisticsAction.do?cmd=toMmsStaticsByGroup&groupId="+document.getElementById('org_id').
var url ='&%=request.getContextPath()%&/statisticsAction.do';
var pars = 'cmd=getGroupByOrg&org_id='+document.getElementById('org_id').
var myAjax = new Ajax.Request(url,{method:'post',parameters:pars,onComplete:_complete});
//请求完成的处理
function _complete(originalRequest)
var statusValue = originalRequest.
var arr = originalRequest.responseT
if(statusValue==200)
var group=document.getElementById("columnInfoId");
group.length=0;
group.options.add(new Option("--全部--", "ALL"));
var jsonss=eval("("+arr+")");
for(var i=0;i&jsonss.i++){
group.options.add(new Option(jsonss[i].GroupName, jsonss[i].GroupId));
else if(statusValue==404)
alert("代码出现错误,链接地址有误");
alert("代码出现未知错误");
页面布局中：
&TABLE width="95%" align=center cellpadding="0" cellspacing="0"&
&TD class="zi_3F6293" align="left" height="35" width="50"& 机&&&&构：&/TD&
&SELECT style="width:150px" name="groupId" id = "org_id"
value="${param.org_id}" onChange="change(this.options[this.options.selectedIndex].value)"&
&c:forEach items="${organizations}" var="org"&
&c:if test="${groupId == org['GroupId']}"&
&OPTION value="${org['GroupId']}" selected="selected"&${org['GroupName']}&/OPTION&
&c:if test="${groupId != org['GroupId']}"&
&OPTION value="${org['GroupId']}" &${org['GroupName']}&/OPTION&
&/c:forEach&
&TD class=zi_3F6293 align="left" height="35" width="50"&群&&&&组：&/TD&
&SELECT style="width:150Px" name="columnInfoId"
id="columnInfoId" &
&OPTION value="ALL"&---全部---&/OPTION&
参考：http://www.cnblogs.com/chenji/archive//1834580.html
浏览 27998
hongmeikaile
浏览: 93528 次
来自: 北京
大神你好，请教你，ajax怎么访问数据库并返回list对象，对 ...
老板，可以提供源码下载吗？
初学这玩意，有调通的源码学习方 ...
我总结好长时间，都是一些基础的知识，特别适合ORACLE初学者 ...
自己先评价一下噢！哈哈。。。继续努力！
其实最好的学习参考还是API，目前的最新版本是：jQueryA ...
(window.slotbydup=window.slotbydup || []).push({
id: '4773203',
container: s,
size: '200,200',
display: 'inlay-fix'16:22 提问
AJAX从Servlet获得的json格式的值，怎么循环输出在表格中
type :"post",
url : "ShowOther?Start="+start+"&End="+end,
async:false,
dataType : "json",
success : function(data) {
if(data.alert==flag||data.alert=="no"){
alert("该时间段内无任何消费");
var title ="&table border='0' width='100%'&&tr&&td align='center'&"
+"&tr&&td align="center"&&font size="3" color="black"&&strong&流水号&/strong&&/font&&/td&"
+"&td align="center"&&font size="3" color="black"&&strong&消费地&/strong&&/font&&/td&"
+"&td align="center"&&font size="3" color="black"&&strong&总金额&/strong&&/font&&/td&"
+"&td align="center"&&font size="3" color="black"&&strong&时间&/strong&&/font&&/td&&/tr&"
for(m=0;m&data.size();m++){
title=title+"&tr&";
title=title+"&td&&a href='#' onclick='alertWin("+data[m].Cno+");'&"+data[m].Cno+"&/a&&/td&";
title=title+"&td&"+data[m].Cplace+"&/td&";
title=title+"&td&"+data[m].Csum+"&/td&";
title=title+"&td&"data[m].Ctime+"&/td&";
title=title+"&/tr&";}
$("#table").html(title);
error : function(data) {
alert("失败");
通过title把值输出在指定的div中，没有反应，但如果改成alert(“成功”);是有运行到的。
按赞数排序
data是什么结构，既有data.alert这种写法，也有data.size()。
可以试试这个函数，循环遍历$(data).each(function(index, value) {});
准确详细的回答，更有利于被提问者采纳，从而获得C币。复制、灌水、广告等回答会被删除，是时候展现真正的技术了！
其他相关推荐