2-8自由编程 笔记

来源:2-8 自由编程

我还差得多

2020-08-19 09:30:11

package com.imooc.ajax.text;

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 content
 */
@WebServlet("/content/text")
public class content extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public content() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		List list=new ArrayList();
		list.add("小明<br>小展<br>小红");
		list.add("主任<br>组长<br>职员");
		list.add("销售部<br>技术部<br>公关部");
		String json = JSON.toJSONString(list);
		response.setContentType("text/html;charset=utf-8");
		response.getWriter().println(json);
				
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <div id="button" style="text-align: center;width: 400px;margin: 0 auto">
        <input type="button" id="001" value="员工列表" style="padding: 10px; width: 100px">
        <input type="button" id="002" value="职位列表" style="padding: 10px;margin: 0 20px;width: 100px">
        <input type="button" id="003" value="部门列表" style="padding: 10px;;width: 100px">
    </div>
    <div id="view" style="width: 400px; text-align: center ;margin: 0 auto">
    </div>
    <script src="../js/jquery-3.5.1.js"></script>
<script type="text/javascript">
    var id;
    $(document).ready(function (){
        $("input").bind("click",function (){
            id = $(this).attr('id');
            var  xmlHttp;
            if(window.XMLHttpRequest)
                xmlHttp= new XMLHttpRequest();
            else
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            xmlHttp.open("get","/ajax//content/text",true);
            xmlHttp.send();
            xmlHttp.onreadystatechange=function (){
                if (xmlHttp.readyState==4&&xmlHttp.status==200){
                        var text= xmlHttp.responseText;
                        var json=JSON.parse(text);
                        var ine=parseInt(id);
                        var html=""+json[ine-1];
                    document.getElementById("view").innerHTML=html;
                }}
        })
    })


</script>
</body>
</html>


写回答

1回答

我还差得多

提问者

2020-08-19

不用回答l

1

0 学习 · 9666 问题

查看课程