问一下老师
来源:2-8 自由编程
qq_ibertine_0
2020-09-14 19:15:22
除了问答区置顶的方法没有其他写法了吗
我写了一个但是获取不到单独的,能把整个数据获取到1没办法获取单独的名字职业部门
package com.imooc.ajax;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.alibaba.fastjson.JSON;
/**
* Servlet implementation class JobServlet
*/
@WebServlet("/JB")
public class JobServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public JobServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String name="小红"+"<br>"+"小明"+"<br>"+"小白";
String job="职员"+"<br>"+"经理";
String department="人事部"+"<br>"+"技术部"+"<br>"+"无线事业部";
List list=new ArrayList();
list.add(name);
list.add(job);
list.add(department);
String json=JSON.toJSONString(list);
response.setContentType("text/html;charset=utf-8");
response.getWriter().println(json);
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<input type="button" value="员工列表" style="text-align:center;width:400px" id="name">
<input type="button" value="职位列表" style="text-align:center;width:400px" id="job">
<input type="button" value="部门列表" style="text-align:center;width:400px" id="part">
<div id="content"></div>
<script type="text/javascript">
document.getElementById("name").onclick=function(){
var xmlhttp1;
xmlhttp1=new XMLHttpRequest();
xmlhttp1.open("GET","/Ajax/JB",true);
xmlhttp1.send();
xmlhttp1.onreadystatechange=function(){
if(xmlhttp1.readyState==4&&xmlhttp1.status==200){
var json=JSON.parse(xmlhttp1.responseText);
document.getElementById("content").innerHTML=json.name;
}
}
}
</script>
</body>
</html>
2回答
同学你好!
1,点击对应按钮是下面那段代码运行的结果,所以把for循环中取消注释下面的代码也会运行成功;
2,是的,xmlHttpRequest.responseText决定响应的数据类型就是一个字符串的文本内容,得到的是response.getWriter().print()中的数据。
3,SON.parse() 将得到的数据转换为 JavaScript 对象
祝学习愉快
好帮手慕阿园
2020-09-15
同学你好,实现效果的方式有很多种,同学按照自己方式实现效果就可以
同学的代码是将数据直接存放在list集合中,同学通过对象.name获取不到对应的值,可以通过点击按钮,获取对应集合的索引,来获取到对应的值
修改后代码如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <input type="button" value="员工列表" style="text-align:center;width:400px" id="name"> <input type="button" value="职位列表" style="text-align:center;width:400px" id="job"> <input type="button" value="部门列表" style="text-align:center;width:400px" id="part"> <div id="content"></div> <script type="text/javascript" src="js/jquery-3.3.1.js"></script> <script type="text/javascript"> /* document.getElementById("name").onclick=function(){ */ var xmlhttp1; xmlhttp1=new XMLHttpRequest(); xmlhttp1.open("GET","/ajax/JB",true); xmlhttp1.send(); xmlhttp1.onreadystatechange=function(){ if(xmlhttp1.readyState==4&&xmlhttp1.status==200){ var json=JSON.parse(xmlhttp1.responseText); console.log(json); /* for(var i=0;i<json.length;i++){ var emp = json[i]; document.getElementById("content").innerHTML=json[i]; } */ $("#name").click(function(){ document.getElementById("content").innerHTML=json[0]; }) $("#job").click(function(){ document.getElementById("content").innerHTML=json[1]; }) $("#part").click(function(){ document.getElementById("content").innerHTML=json[2]; }) } } /* } */ </script> </body> </html>
如果我的回答解决了你的疑惑,请采纳!祝学习愉快!
相似问题