点击按钮没反应
来源：3-6 自由编程
慕的地2082093
2020-02-06 17:59:08
package json;
import java.util.List;
import java.io.IOException;
import java.util.ArrayList;
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 songServlet
*/
@WebServlet("/songs")
public class songServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public songServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
//response.getWriter().append("Served at: ").append(request.getContextPath());
String type=request.getParameter("t");
List list=new ArrayList();
if(type!=null&&type=="流行歌曲") {
list.add("<h1>稻香<br>晴天<br>告白气球</h1>");
}else if(type!=null&&type=="经典歌曲") {
list.add("<h1>千千阙歌<br>傻女<br>七友</h1>");
}else if(type!=null&&type=="摇滚歌曲") {
list.add("<h1>一块红布<br>假行僧<br>新长征路上的摇滚</h1>");
}
String json=JSON.toJSONString(list);
response.setContentType("text/html;charset=UTF-8");
response.getWriter().println(json);
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div style="text-align:center">
<input type="button" name="in" value="流行歌曲">
<input type="button" name="in" value="经典歌曲">
<input type="button" name="in" value="摇滚歌曲">
</div>
<div id="content"></div>
</body>
<script type="text/javascript" src"js/jquery-3.4.1.js"></script>
<script type="text/javascript">
var input=document.getElementsByName("in");
for(var i=0;i<input.length;i++){
input[i].setAttribute("index",i);
input[i].onclick=function(){
var idx=this.getAttribute("index");
var songlist="";
if(idx==0){
songlist="流行歌曲";
}else if(idx==1){
songlist="经典歌曲";
}else if(idx==2){
songlist="摇滚歌曲";
}
$(function(){
$.ajax({
"url":"/ajax/songs",
"type":"get",
"data":{"t":songlist},
"data-Type":"json",
"success":function(json){
for(var i=0;i<json.length;i++){
$("content").append=json[i];
}
},
"error":function(xlmhttp,errorText){
if(xmlhttp.status=="405"){
alert("无效的请求方式");
}else if(xmlhttp.status=="404"){
alert("未找到URL资源");
}else if(xmlhttp.status=="500"){
alert("服务器内部错误，请与管理员联系");
}else{
alert("产生异常，请与管理员联系");
}
}
})
})
}
}
</script>
</html>
1回答
-
好帮手慕酷酷
2020-02-06
同学你好，这里报错的原因是
1、导入js不正确，具体如下：
2、Servlet类的字符串判断应该是equals(）方法，具体如下：
3、html整体编写的有点小问题，不能function里面嵌套function(）方法，建议同学参考一下如下同学的代码：https://class.imooc.com/course/qadetail/173206
如果我的回答解决了你的疑惑，请采纳！祝学习愉快！
0
相似问题