请老师帮看看报错以及点击按钮没有反应
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String path = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ request.getContextPath() + "/";
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>播放列表查看</title>
</head>
<body>
<center>
<input type="button" name="popular" value="流行歌曲" id="butt1">
<input type="button" name="classic" value="经典歌曲" id="butt2">
<input type="button" name="rock" value="摇滚歌曲" id="butt3">
</center>
<div>
<h3 id="song1"></h3>
<h3 id="song2"></h3>
<h3 id="song3"></h3>
</div>
<script type="text/javascript" src="resources/js/jquery-3.3.1.js"></script>
<script type="text/javascript">
$("#butt1").click(function(){
//单机触发Ajax事件
$.ajax({
url:"<%= path%>/SongServlet",
type:"post",
data:{
name:$("input[name=popular]").val(),
},
dataType:"json",
success:function(result){
$("#song1").text(result.song1);
$("#song2").text(result.song2);
$("#song3").text(result.song3);
},
});
});
$("#butt2").click(function(){
$.ajax({
url:"<%= path%>/SongServlet",
type:"post",
data:{
name:$("input[name=classic]").val(),
},
dataType:"json",
success:function(result){
$("#song1").text(result.song1);
$("#song2").text(result.song2);
$("#song3").text(result.song3);
},
});
});
$("#butt3").click(function(){
$.ajax({
url:"<%= path%>/SongServlet",
type:"post",
data:{
name:$("input[name=rock]").val(),
},
dataType:"json",
success:function(result){
$("#song1").text(result.song1);
$("#song2").text(result.song2);
$("#song3").text(result.song3);
},
});
});
</script>
</body>
</html>
---------------------------------------------------------------------------------------
package com.leo.ajaxtest;
import java.io.IOException;
import java.util.HashMap;
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 org.json.JSONObject;
/**
* Servlet implementation class SongServlet
*/
public class SongServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
String song = request.getParameter("name");
JSONObject jsonObject = null;
if (song.equals("流行歌曲")) {
jsonObject = new JSONObject("{song1:稻香,song2:晴天,song3:告白气球}");
} else if (song.equals("经典歌曲")) {
jsonObject = new JSONObject("{song1:夜半小夜曲,song2:17岁,song3:车站}");
} else if (song.equals("摇滚歌曲")) {
jsonObject = new JSONObject("{song1:像风一样自由,song2:巴比龙,song3:假行僧}");
}
response.getOutputStream().write(jsonObject.toString().getBytes("utf-8"));
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
正在回答
1、添加对外虚拟访问路径后是没有问题的运行结果如下：
2、关于报错，因为看不到是哪里报错，建议同学重新建一个项目，把代码粘过去试试。
3、如果还是不显示，请同学在浏览器端按F12，查看一下浏览器控制台是否有报错，如果有，报错信息是什么。
如果我的回答解决了你的疑惑，请采纳！祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 1088 份
- 解答问题 10205 个
如果你有Java语言基础，又想以后从事Java Web开发，那么本路径是你的不二选择！本路径从网页搭建开始入手，通过大量案例来学习Java Web基础。定能助你完成Java Web小白的蜕变！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星