老师,效果实现了,但我感觉我的实现过程有些繁琐,帮忙看下哪里逻辑不对?
来源:3-6 自由编程
加油啊豪
2020-08-08 23:43:40
musicList.jsp
<%@ 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>
<style type="text/css">
.title{
width: 300px;
}
.container_style{
float: left;
text-align: center;
margin-left: 400px;
}
</style>
</head>
<body>
<div style="float: left">
<input type="submit" name="pop" value="流行歌曲" class="title">
<input type="submit" name="classics" value="经典歌曲" class="title">
<input type="submit" name="rock" value="摇滚歌曲" class="title">
</div>
<div id="container" class="container_style"></div>
<script type="text/javascript" src="js/jquery-3.5.1.js"></script>
<script type="text/javascript">
$("input[name='pop']").click(function(){
$.ajax({
"url": "/ajax/popMusicList",
"type": "get",
"data": "",
"dataType": "json",
"success": function(json){
document.getElementById("container").innerHTML="";
for(var i=0;i<json.length;i++){
$("#container").append("<h2>"+ json[i].name +"</h2>");
}
}
})
});
$("input[name='classics']").click(function(){
$.ajax({
"url": "/ajax/classicsMusicList",
"type": "get",
"data": "",
"dataType": "json",
"success": function(json){
document.getElementById("container").innerHTML="";
for(var i=0;i<json.length;i++){
$("#container").append("<h2>"+ json[i].name +"</h2>");
}
}
})
});
$("input[name='rock']").click(function(){
$.ajax({
"url": "/ajax/rockMusicList",
"type": "get",
"data": "",
"dataType": "json",
"success": function(json){
document.getElementById("container").innerHTML="";
for(var i=0;i<json.length;i++){
$("#container").append("<h2>"+ json[i].name +"</h2>");
}
}
})
});
</script>
</body>
</html>
Music.java
package com.imooc.ajax.music;
public class Music {
private String name;
public Music() {
// TODO Auto-generated constructor stub
}
public Music(String name) {
super();
this.name = name;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
PopMusicListServlet.java
package com.imooc.ajax.music;
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 MusicListServlet
*/
@WebServlet("/popMusicList")
public class PopMusicListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public PopMusicListServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<Music> popList = new ArrayList<Music>();
popList.add(new Music("稻香"));
popList.add(new Music("晴天"));
popList.add(new Music("告白气球"));
String popJson = JSON.toJSONString(popList);
response.setContentType("text/htm;charset=UTF-8");
response.getWriter().println(popJson);
}
}
ClassicsMusicListServlet.java
package com.imooc.ajax.music;
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 ClassicsMusicListServlet
*/
@WebServlet("/classicsMusicList")
public class ClassicsMusicListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public ClassicsMusicListServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<Music> classicsList = new ArrayList<Music>();
classicsList.add(new Music("千千阙歌"));
classicsList.add(new Music("傻女"));
classicsList.add(new Music("七友"));
String classicsJson = JSON.toJSONString(classicsList);
response.setContentType("text/htm;charset=UTF-8");
response.getWriter().println(classicsJson);
}
}
RockMusicListServlet.java
package com.imooc.ajax.music;
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 RockMusicListServlet
*/
@WebServlet("/rockMusicList")
public class RockMusicListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public RockMusicListServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<Music> rockList = new ArrayList<Music>();
rockList.add(new Music("一块红布"));
rockList.add(new Music("假行僧"));
rockList.add(new Music("新长征路上的摇滚"));
String rockJson = JSON.toJSONString(rockList);
response.setContentType("text/htm;charset=UTF-8");
response.getWriter().println(rockJson);
}
}
1回答
同学你好,已完成练习,继续加油!不过同学可以只定义一个Servlet类,根据传递的参数进行判断,在不同的条件中,将数据添加到集合中,并将数据返回。实现代码同学可参考:https://class.imooc.com/course/qadetail/219274
如果我的回答解决了你的疑惑,请采纳,祝学习愉快~
相似问题