如何在javascript中迭代MapArrayList？
我有下面的示例地图阵列列表。首先，如何使用javascript从纯html内部访问此arraylist？第二，我如何迭代这个列表如何在javascript中迭代MapArrayList？,javascript,jquery,html,jsp,arraylist,Javascript,Jquery,Html,Jsp,Arraylist,我有下面的示例地图阵列列表。首先，如何使用javascript从纯html内部访问此arraylist？第二，我如何迭代这个列表 <%@page import="org.json.simple.JSONObject"%> <%@page import="org.json.simple.JSONArray"%> <% JSONObject json = new JSONObject(); JSONArray list = new JSONArray(); JSONO
<%@page import="org.json.simple.JSONObject"%>
<%@page import="org.json.simple.JSONArray"%>
<%
JSONObject json = new JSONObject();
JSONArray list = new JSONArray();
JSONObject course1,course2,course3,course4,course5;
course1 = new JSONObject();
course1.put("code", "ME101");
course1.put("desc", "Marine Engineering 101");
course1.put("sched", "June 1 - August 30, 2014");
course1.put("rsvd", "56");
course1.put("crssched", "cme101s1");
list.add(course1);
course2 = new JSONObject();
course2.put("code", "ME102");
course2.put("desc", "Marine Engineering 102");
course2.put("sched", "September 1 - November 31, 2014");
course2.put("rsvd", "25");
course2.put("crssched", "cme102s1");
list.add(course2);
course3 = new JSONObject();
course3.put("code", "CS101");
course3.put("desc", "Certificate on Seamanship 101");
course3.put("sched", "June 1 - June 30, 2014");
course3.put("rsvd", "36");
course3.put("crssched", "ccs101s1");
list.add(course3);
course4 = new JSONObject();
course4.put("code", "ME201");
course4.put("desc", "Marine Engineering 201");
course4.put("sched", "June 15 - July 16, 2014");
course4.put("rsvd", "65");
course4.put("crssched", "cme201s1");
list.add(course4);
course5 = new JSONObject();
course5.put("code", "ME202");
course5.put("desc", "Marine Engineering 202");
course5.put("sched", "July 1 - August 30, 2014");
course5.put("rsvd", "15");
course5.put("crssched", "cme202s1");
list.add(course5);
json.put("Courses", list);
response.setContentType("application/json");
response.getWriter().write(json.toString());
看起来你可能想调查一下
-
- （如果不使用jQuery，请查看JSP部分。）
实际上，从JSP交付类似的内容（不带格式）：
在Javascript中，您可以通过迭代等方式执行和访问数组对象
var i, obj, objArray = JSON.parse(json_from_JSP);
for (i = 0; i < objArray,length; ++i) {
obj = objArray[i];
// Here you would have e.g. obj.code === "ME201"
// or you can access it by obj["code"]
// or objArray[i]["code"] etc.
}
看看ajax请求。与jQuery或纯Javascript一起使用。您还可以将其扩展为包含POST和GET数据，以便在服务器上进一步处理这些数据。通常提出有针对性的请求，过滤掉你想要的回报
样本输出：
使用上述+pretty_print（）
时，您的输出应该如下所示：
+------------+
| Get data | <--- button ;-)
+------------+
[
{
"code": "ME201",
"desc": "Marine Engineering 201",
"sched": "June 1 - June 30, 2014",
"rsvd": "65",
"crssched": "cme201s1"
},
{
"code": "ME202",
"desc": "Marine Engineering 202",
"sched": "June 1 - June 30, 2014",
"rsvd": "65",
"crssched": "cme202s1"
}
]
--------------------------
CODE: ME201
CODE: ME202
+------------+
|获取数据|列表
不是Javascript。不，不是。这是jsp中的一个“示例”数据。@JNewbie：还请注意，从更新的代码中，将服务于包含数组的对象，而不是包含对象的数组。并且：在发送“application/json”头时，ajax请求返回的不是字符串，而是对象。（因此在Javascript中没有JSON.parse（reply）
）如果需要数组，请说list.toString（）
，而不是JSON.put（“课程”，列表）；和json.toString（）
在javascript中，您可以添加一个if（typeof responseData==“string”）{responseData=json.parse（responseData）；}
谢谢！我研究了JSON并更新了上面的示例数据。我如何“公开”它以便能够从另一个html页面通过javascript访问它？@JNewbie：如果我说您的JSP脚本不是html代码的一部分，而是您想要“调用”以获取JSON数据/映射数组的后端脚本，那么我是否正确地理解了您的意思？是的，您是正确的。我需要从一个html文件（viewschedules.html）中调用一个jsp文件（schedules.jsp），该文件将包含这个JSON映射数组。由于您提供的解决方案，我现在可以使用它了。如果我现在可以，我会给你+1，但我还是不能。多谢各位@JNewbie：非常欢迎。你还表现出努力回应和兴趣，这是一个很大的优势。AJAX+JSON与一些服务器语言和Javascript的结合使用非常强大，并且在涉及动态内容时提供了一些非常好的可能性。关于这个问题，这里有很多很好的问答。另外，请查看标签页，特别是学习JavaScript部分（如果您是JavaScript新手）。如果您非常感兴趣，请阅读/浏览ECMA标准。我还建议：
var jsonData = '<%= json.toString() %>';
<!DOCTYPE html>
<html>
<head>
<title>JSP Ajax test</title>
<meta charset="UTF-8" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<button id="btn_data">Get data</button>
<pre id="dump"></pre>
</body>
</html>
// Function to process the data in response
function process_json(jsonString) {
var i, obj, data = JSON.parse(jsonString);
dump = $("#dump");
// If you want to see what the data string looks like
dump.html(jsonString + "\n");
// Loop the array and do what you want with each object.
for (i = 0; i < data.length; ++i) {
$("#dump").append("CODE: " + data[i].code + "\n");
}
}
$(document).ready(function () {
$("#btn_data").click(function () {
$.ajax({
type : "GET",
url : "schedules.jsp",
async : false,
success: process_json // Function to process the data
});
});
});
function pretty_print(jsonString) {
var obj = JSON.parse(jsonString),
str = JSON.stringify(obj, null, " ");
$("#dump").html(str + "\n--------------------------\n");
}
+------------+
| Get data | <--- button ;-)
+------------+
[
{
"code": "ME201",
"desc": "Marine Engineering 201",
"sched": "June 1 - June 30, 2014",
"rsvd": "65",
"crssched": "cme201s1"
},
{
"code": "ME202",
"desc": "Marine Engineering 202",
"sched": "June 1 - June 30, 2014",
"rsvd": "65",
"crssched": "cme202s1"
}
]
--------------------------
CODE: ME201
CODE: ME202