请老师看看程序哪里有问题
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="resource/js/jquery-3.3.1.js"></script>
<title>留言板</title>
<%
String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
String username=(String)session.getAttribute("username");
%>
</head>
<body>
<center>
<h1>留言板</h1>
<label><span>留言人:</span><input id="username" type="text" readonly="readonly" value="<%=username %>" name="username"></label>
<label><span>标题:</span><input id="title" type="text" name="title"></label>
<label><span>内容:</span><textarea id="content" name="content"></textarea></label>
<label><input type="button" value="提交" onclick="showMessages()"></label>
</center>
<table>
<tr>
<th>留言人</th>
<th>标题</th>
<th>内容</th>
</tr>
<tbody id="messages">
</tbody>
</table>
<script>
function showMessages(){
alert("success");
XMLHttpRequest xml=new XMLHttpRequest();
xml.open("POST",'<%=basePath %>/MessageServlet','true');
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var params="username="+$("input[name=username]")+"&title="+$("input[name=title]")+"&content="+$("input[name=content]");
alert(params);
xml.send(params);
xml.onreadystatechange=function(){
if(xml.readystate=="4"&&xml.status=="200"){
var html=xml.responseText;
alert(html);
document.getElementById("messages").innerHtml=html;
}
}
}
</script>
</body>
</html>package com.imooc.servlet;
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 org.json.JSONObject;
import com.imooc.db.Message;
import com.sun.glass.ui.Application;
@WebServlet("/MessageServlet")
public class MessageServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String username=request.getParameter("username");
String title=request.getParameter("title");
String content=request.getParameter("content");
System.out.println("username:"+username+"\ntitle:"+title+"\ncontent:"+content);
//获取前端保存的留言内容列,并将新的留言添加进去
List<Message> messagesList=(List<Message>)request.getServletContext().getAttribute("messagesList");
if(messagesList==null){
messagesList=new ArrayList<Message>();
}
Message message=new Message(username,title,content);
messagesList.add(message);
request.getServletContext().setAttribute("messagesList", messagesList);
//在后台拼接html内容,并返回给前端显示
String html="";
JSONObject json=null;
for(Message temp:messagesList){
html+="<tr><td>"+temp.getUsername()+"</td><td>"+temp.getTitle()+"</td><td>"+temp.getContent()+"</td></tr>";
}
json=new JSONObject(html);
response.getOutputStream().write(json.toString().getBytes("utf-8"));
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}现在点击提交按钮没有能调用js方法,请问是哪里出了问题
0
收起
正在回答 回答被采纳积分+1
2回答
好帮手慕阿满
2018-11-20 18:26:33
同学在使用ajax时有些问题,如下:
1、定义变量时应该使用var定义变量。
2、设置请求头时应该使用xml设置。
3、get请求时,send()方法没有参数。
4、onreadstatechange函数中,状态码不需要用引号。
5、最后显示服务器响应文本时的代码为document.getElementById("messages").innerHTML = xml.responseText;
代码修改如图:

修改后的代码为:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="resources/js/jquery-1.4.2.js"></script>
<title>留言板</title>
<%
String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
String username=(String)session.getAttribute("username");
%>
</head>
<body>
<center>
<h1>留言板</h1>
<label><span>留言人:</span><input id="username" type="text" readonly="readonly" value="<%=username %>" name="username"></label>
<label><span>标题:</span><input id="title" type="text" name="title"></label>
<label><span>内容:</span><textarea id="content" name="content"></textarea></label>
<label><input type="button" value="提交" onclick="showMessages()"></label>
</center>
<table>
<tr>
<th>留言人</th>
<th>标题</th>
<th>内容</th>
</tr>
<tbody id="messages">
</tbody>
</table>
<script type="text/javascript">
function showMessages(){
alert("success");
var xml = new XMLHttpRequest();
// XMLHttpRequest xml=new XMLHttpRequest();
xml.open("POST",'<%=basePath %>/MessageServlet','true');
// xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var params="username="+$("input[name=username]")+"&title="+$("input[name=title]")+"&content="+$("input[name=content]");
alert(params);
xml.send();
xml.onreadystatechange=function(){
//if(xml.readystate=="4"&&xml.status=="200"){
if(xml.readyState==4&&xml.status==200){
var html=xml.responseText;
alert(html);
// document.getElementById("messages").innerHtml=html;
document.getElementById("messages").innerHTML = xml.responseText;
}
}
}
</script>
</body>
</html> 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 org.json.JSONObject;
import com.imooc.jdbc.bean.Message;
import com.sun.glass.ui.Application;
@WebServlet("/MessageServlet")
public class MessageServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String username=request.getParameter("username");
String title=request.getParameter("title");
String content=request.getParameter("content");
System.out.println("username:"+username+"\ntitle:"+title+"\ncontent:"+content);
//获取前端保存的留言内容列,并将新的留言添加进去
List<Message> messagesList=(List<Message>)request.getServletContext().getAttribute("messagesList");
if(messagesList==null){
messagesList=new ArrayList<Message>();
}
Message message=new Message("1","2","3");
messagesList.add(message);
request.getServletContext().setAttribute("messagesList", messagesList);
//在后台拼接html内容,并返回给前端显示
String html="";
JSONObject json=null;
for(Message temp:messagesList){
html+="<tr><td>"+temp.getUsername()+"</td><td>"+temp.getTitle()+"</td><td>"+temp.getContent()+"</td></tr>";
}
/*json=new JSONObject(html);
response.getOutputStream().write(json.toString().getBytes("utf-8"));*/
response.getOutputStream().write(html.getBytes("UTF-8"));
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}如果我的回答解决了你的疑惑,请采纳。祝:学习愉快!
好帮手慕阿满
2018-11-20 16:03:03
同学你好,在jsp中应该有<form action="messageSub.jsp" ></form>将留言板代码部分包裹进来,当点击提交按钮时,会提交到messageSub.jsp页面。可参考如下代码:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.util.*,model.*" %>
<%
String user = (String)session.getAttribute("loginUser");
String subFlag = request.getParameter("subFlag");
List<Message> messages = (List<Message>)session.getAttribute("messages");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>留言板</title>
<link href="form.css" rel="stylesheet" type="text/css" />
<link href="table.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var subFlag = '<%=subFlag%>';
if('1'==subFlag){
alert('留言成功!');
}
</script>
</head>
<body>
<form action="messageSub.jsp" method="post" class="smart-green">
<h1>留言板</h1>
<label>
<span>留言人 :</span>
<input id="user" type="text" name="user" value="<%=user %>" readonly/>
</label>
<label>
<span>标题 :</span>
<input id="title" type="text" name="title" value=""/>
</label>
<label>
<span>内容 :</span>
<textarea id="content" name="content"></textarea>
</label>
<span> </span>
<label>
<input type="submit" class="button" value="提交"/>
</label>
</form>
<br/>
<table id="table-3" width="85%" align="center">
<tr>
<th width="15%">留言人</th>
<th width="15%">标题</th>
<th width="70%">内容</th>
</tr>
<%
if(messages!=null){
for(Message message : messages){
%>
<tr>
<td><%=user %></td>
<td><%=message.getTitle() %></td>
<td><%=message.getContent() %></td>
</tr>
<%
}
}
%>
</table>
</body>
</html>如果我的回答解决了你的疑惑,请采纳。祝:学习愉快!
从网页搭建入门Java Web2018版
- 参与学习 人
- 提交作业 1088 份
- 解答问题 10204 个
如果你有Java语言基础,又想以后从事Java Web开发,那么本路径是你的不二选择!本路径从网页搭建开始入手,通过大量案例来学习Java Web基础。定能助你完成Java Web小白的蜕变!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星