老师看看，点击按钮无响应

package com.ajax.practice;

public class Employee {
private String name;
private String job;
private String department;

public Employee() {
	
}

public Employee(String name, String job, String department) {
	super();
	this.name = name;
	this.job = job;
	this.department = department;
}

public String getName() {
	return name;
}

public void setName(String name) {
	this.name = name;
}

public String getJob() {
	return job;
}

public void setJob(String job) {
	this.job = job;
}

public String getDepartment() {
	return department;
}

public void setDepartment(String department) {
	this.department = department;
}


}

package com.ajax.practice;

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 ajaxEmp
 */
@WebServlet("/ajaxEmp")
public class ajaxEmp extends HttpServlet {
	private static final long serialVersionUID = 1L;

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		List list=new ArrayList();
		list.add(new Employee("小红","职员","人事部"));
		list.add(new Employee("小明","经理","技术部"));
		list.add(new Employee("小白","职员","无线事业部"));
		String json=JSON.toJSONString(list);
		response.setContentType("text/html;charset=UTF-8");
		response.getWriter().println(json);
	}

}

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div align="center">
<input style="width:200px" id="btn0" type="button" value="员工列表">
<input style="width:200px" id="btn1" type="button" value="职位列表">
<input style="width:200px" id="btn2" type="button" value="部门列表">
</div>
<div id="content" align="center"></div>
<script type="text/javascript">
var xmmlhttp;
if(windows.XMLHttpRequest){
	xmlhttp=new XMLHttpRequest();

}else{
   xmlhttp=new ActiveXOject("Microsoft.XMLHttp")
}
xmlhttp.open("GET","/jQueryPractice/ajaxEmp",true);
xmlhttp.send();
xmlhttp.onreadyStatechange=function(){
	if(xmlhttp.readyState==4&&xmlhttp.status==200){
		var text=xmlhttp.responseText;
		var json=JSON.parse(text);
		
		//员工列表
		document.getElementById("btn0").onclick=function(){
			var html="";
			var num=0;
			for(var i=0;i<json.length;i++){
				html+=json[i].name+"<br>";
			}
			document.getElementById("content").innerHTML=html;
			
		}
		
		//职位列表
		document.getElementById("btn1").onclick=function(){
			var html="";
			var num=0;
			for(var i=0;i<json.length;i++){
				var job=json[i].job;
				html+=json[i].job+"<br>";
			}
			document.getElementById("content").innerHTML=html;
			
			//部门列表
			document.getElementById("btn2").onclick=function(){
				var html="";
				for(var i=0;i<json.length;i++){
				html+=json[i].department+"<br>";
				
				}
				document.getElementById("content").innerHTML=html;
			
		}
		}
	}
}
</script>
</body>
</html>

独孤求戒 2019-04-25

源自：jQuery与Ajax入门 2-8 自由编程

收起

1回答

好帮手慕柯南回答被采纳获得+3积分 2019-04-26 10:22:29

同学你好！

1.在你的代码中有个小问题，这里应该是window，同学多加了s

2.点击按钮没有反应是因为同学在点击按钮后没有去发送ajax请求，同学可以参考如下代码（以员工列表为例）：

如果我的回答解决了你的疑惑，请采纳，祝学习愉快~

收起回答

独孤求戒提问者 #1

每一个列表都要写这段发送ajax请求的代码岂不是很麻烦？有没有简单的办法

2019-04-26 16:09:41
好帮手慕柯南回复提问者独孤求戒 #2

同学不可以呢，你的三个按钮相当于三个不同的功能，所以每个按钮都需要去发送ajax请求的，在今后我们可以根据每个按钮返回不同的信息呢。

2019-04-26 16:13:17