课题打卡，请老师检查

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<style type="text/css">
    div{
        text-align: center;
        
    }
    
</style>
</head>
<body>

    <div>
        <input type="button" value="流行歌曲" id="pop">
        <input type="button" value="经典歌曲" id="classic">
        <input type="button" value="摇滚歌曲" id="rock">
    </div>
    <div id="container"></div>
    
    <script type="text/javascript" src="js/jquery-3.5.1.js"></script>
    <script type="text/javascript">
        $("input[type='button']").click(function(){
        	var id = $(this).attr("id");

        	$.ajax({
        		"url":"/ajax/music",
        		 "type":"post",
        		 "data":{"t":id},
        		 "dataType":"json",
        		 "success": function(json){
        			  console.log(json.length);
        			  for ( var i = 0; i<json.length; i++){
        				  var html;
        				  if(html == null){
        					  html = "<h2>" + json[i] +"</h2>";
        				  }else{
        					  html = html + "<h2>" + json[i] +"</h2>";
        				  }
        			  }
        			 $("#container").html(html);
        		 },	
        	});

        });

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

package ajax;

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
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 Musci
 */
@WebServlet("/music")
public class Musci extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public Musci() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	  request.setCharacterEncoding("UTF-8");
	  response.setContentType("text/html;charset=utf-8");
	  String type = request.getParameter("t");
	  Map<String, List> map = new HashMap<String, List>();
	  List<String> list = new ArrayList<String>();
	  list.add("稻香");list.add("晴天");list.add("告白气球");
	  map.put("pop", list);
	  List<String> list2 = new ArrayList<String>();
	  list2.add("千千阙歌");list2.add("傻女");list2.add("七友");
	  map.put("classic",list2);
      List<String> list3 = new ArrayList<String>();
	  list3.add("一块红布");list3.add("假行僧");list3.add("新长征路上的摇滚");
	  map.put("rock",list3);
	  List<String> text = new ArrayList<String>();
	  
	  if(map.containsKey(type)) {
	    text = map.get(type);
	  }else {
	    text = list;
	  }
	  String text2 = JSON.toJSONString(text);
	  
	  System.out.println(text2);
	  response.getWriter().println(text2);
	  
	  
	}

}

老师这里有个问题我碰到的没有解决，在music class里面，如果我最后不把 text2转化为json, 而是直接把text发回去，javascript里面

"dataType":"json",

"success": function(json){

console.log(json) 就打印不出任何值出来，但是在response里面能看到值。问下这个是什么原因呢？

}）

慕前端8369922 2020-07-17

源自：jQuery与Ajax入门 3-6 自由编程