52,797
社区成员
发帖
与我相关
我的任务
分享新手，一个例子，为什么点击没有反应
这是一个ajax基础教程 书上的例子，我照着练习，getAndPostExample.html 和 getAndPostExample.java。
我用javac 编译 getAndPostExample.java 为getAndPostExample.class，
然后getAndPostExample.class和getAndPostExample.html在同一目录下，不知道是哪里出错了，
我访问http://localhost:8080/myapp/getAndPostExample.html
输入First name， Middle name，Birthday，然后点击Send parameters using GET 按钮，没有任何反应
点击Send parameters using POST 按钮，也没有反应。
希望大家指出错误和一些应该注意的东西，谢谢。
getAndPostExample.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sending Request Data Using GET and POST</title>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp= new XMLHttpRequest();
}
}
function createQueryString(){
var firstName = document.getElementById("firstName").value;
var middleName = document.getElementById("middleName").value;
var birthday = document.getElementById("birthday").value;
var queryString = "firstName=" + firstName + "&middleName=" + middleName + "&birthday=" + birthday;
return queryString;
}
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
function doRequestUsingPOST(){
createXMLHttpRequest();
var url = "getAndPostExample?timeStamp=" + new Date().getTime();
var queryString = createQueryString();
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
xmlHttp.send(queryString);
}
function handleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
parseResults();
}
}
}
function parseResults(){
var responseDiv = document.getElementById("serverResponse");
if(responseDiv.hasChildNodes()){
responseDiv.removeChild(responseDiv.childNodes[0]);
}
var responseText = document.createTextNode(xmlHttp.responseText);
responseDiv.appendChild(responseText);
}
</script>
</head>
<body>
<h1>Enter your first name,middle name,and birthday:</h1>
<table>
<tbody>
<tr>
<td>First name:</td>
<td><input type="text" id="firstName"></td>
</tr>
<tr>
<td>Middle name:</td>
<td><input type="text" id="middleName"></td>
</tr>
<tr>
<td>Birthday:</td>
<td><input type="text" id="birthday"></td>
</tr>
</tbody>
</table>
<form action="#">
<input type="button" value="Send parameters using GET" onclick="doRequestUsingGET();"/>
<br/><br/>
<input type="button" value="Send parameters using POST" onclick="doRequestUsingPOST();"/>
</form>
<br/>
<h2>Server Response:</h2>
<div id="serverResponse"></div>
</body>
</html>
getAndPostExample.java
package ajaxbook.chap3;
import java.io.*;
import java.net.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class getAndPostExample extends HttpServlet{
protected void processRequest(HttpServletRequest request,HttpServletResponse response,String method)
throws ServletException,IOException{
//Set content type of the response to text/xml
response.setContentType("text/xml");
//Get the user's input
String firstName = request.getParameter("firstName");
String middleName = request.getParameter("middleName");
String birthday = request.getParameter("birthday");
//Create the response text
String responseText = "Hello " + firstName + " " + middleName + ".Your birthday is " + birthday + "."
+ "[Method:" + method + "]";
//Write the response back to the browser
PrintWriter out = response.getWriter();
out.println(responseText);
//Close the writer
out.close();
}
protected void doGet(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
processRequest(request,response,"GET");
}
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
processRequest(request,response,"POST");
}
}
我用javac 编译 getAndPostExample.java 为getAndPostExample.class，
然后getAndPostExample.class和getAndPostExample.html在同一目录下，不知道是哪里出错了，
我访问http://localhost:8080/myapp/getAndPostExample.html
输入First name， Middle name，Birthday，然后点击Send parameters using GET 按钮，没有任何反应
点击Send parameters using POST 按钮，也没有反应。
希望大家指出错误和一些应该注意的东西，谢谢。
getAndPostExample.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sending Request Data Using GET and POST</title>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp= new XMLHttpRequest();
}
}
function createQueryString(){
var firstName = document.getElementById("firstName").value;
var middleName = document.getElementById("middleName").value;
var birthday = document.getElementById("birthday").value;
var queryString = "firstName=" + firstName + "&middleName=" + middleName + "&birthday=" + birthday;
return queryString;
}
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
function doRequestUsingPOST(){
createXMLHttpRequest();
var url = "getAndPostExample?timeStamp=" + new Date().getTime();
var queryString = createQueryString();
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
xmlHttp.send(queryString);
}
function handleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
parseResults();
}
}
}
function parseResults(){
var responseDiv = document.getElementById("serverResponse");
if(responseDiv.hasChildNodes()){
responseDiv.removeChild(responseDiv.childNodes[0]);
}
var responseText = document.createTextNode(xmlHttp.responseText);
responseDiv.appendChild(responseText);
}
</script>
</head>
<body>
<h1>Enter your first name,middle name,and birthday:</h1>
<table>
<tbody>
<tr>
<td>First name:</td>
<td><input type="text" id="firstName"></td>
</tr>
<tr>
<td>Middle name:</td>
<td><input type="text" id="middleName"></td>
</tr>
<tr>
<td>Birthday:</td>
<td><input type="text" id="birthday"></td>
</tr>
</tbody>
</table>
<form action="#">
<input type="button" value="Send parameters using GET" onclick="doRequestUsingGET();"/>
<br/><br/>
<input type="button" value="Send parameters using POST" onclick="doRequestUsingPOST();"/>
</form>
<br/>
<h2>Server Response:</h2>
<div id="serverResponse"></div>
</body>
</html>
getAndPostExample.java
package ajaxbook.chap3;
import java.io.*;
import java.net.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class getAndPostExample extends HttpServlet{
protected void processRequest(HttpServletRequest request,HttpServletResponse response,String method)
throws ServletException,IOException{
//Set content type of the response to text/xml
response.setContentType("text/xml");
//Get the user's input
String firstName = request.getParameter("firstName");
String middleName = request.getParameter("middleName");
String birthday = request.getParameter("birthday");
//Create the response text
String responseText = "Hello " + firstName + " " + middleName + ".Your birthday is " + birthday + "."
+ "[Method:" + method + "]";
//Write the response back to the browser
PrintWriter out = response.getWriter();
out.println(responseText);
//Close the writer
out.close();
}
protected void doGet(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
processRequest(request,response,"GET");
}
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
processRequest(request,response,"POST");
}
}
...全文
请发表友善的回复…
发表回复
fanxinwu 2009-03-19
- 打赏
- 举报
最后总结，是因为url路径不对，所以，新手们在新建工程的时候，一定要小心。
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 15 楼 Ghost_520 的回复:]
参数可以在后台获取得到吗？
[/Quote]
我还是没弄懂你说的后台在哪里，是不是getAndPostExample.class。
应该怎样看后台里的东西，
参数可以在后台获取得到吗？
[/Quote]
我还是没弄懂你说的后台在哪里，是不是getAndPostExample.class。
应该怎样看后台里的东西，
thefirstwind 2009-03-19
- 打赏
- 举报
多用用console.log() + api 基本没什么难题。
Ghost_520 2009-03-19
- 打赏
- 举报
参数可以在后台获取得到吗？
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 12 楼 Ghost_520 的回复:]
引用 10 楼 fanxinwu 的回复:
引用 7 楼 Ghost_520 的回复:
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHt…
[/Quote]
弹出来的值是，
getAndPostExample?firstName=2&middleName=3&birthday=4×tamp=1237429945423
然后我去掉alert(queryString);
并没有在Server Response:下面show出来，看来还是有很多问题，你知道问题出在哪里吗？
引用 10 楼 fanxinwu 的回复:
引用 7 楼 Ghost_520 的回复:
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHt…
[/Quote]
弹出来的值是，
getAndPostExample?firstName=2&middleName=3&birthday=4×tamp=1237429945423
然后我去掉alert(queryString);
并没有在Server Response:下面show出来，看来还是有很多问题，你知道问题出在哪里吗？
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 5 楼 thefirstwind 的回复:]
调试工具推荐firefox + firebug
[/Quote]
谢谢啊，这个firebug蛮好玩的，我在做调试
调试工具推荐firefox + firebug
[/Quote]
谢谢啊，这个firebug蛮好玩的，我在做调试
Ghost_520 2009-03-19
- 打赏
- 举报
[Quote=引用 10 楼 fanxinwu 的回复:]
引用 7 楼 Ghost_520 的回复:
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
…
[/Quote]
那说明出现了脚本错误吧，你调试下 createQueryString() ，看看这个返回值是什么
引用 7 楼 Ghost_520 的回复:
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
…
[/Quote]
那说明出现了脚本错误吧，你调试下 createQueryString() ，看看这个返回值是什么
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 8 楼 zliu789 的回复:]
你的url有问题 你ajax请求的 servlet 的地址不对 当然访问不到了
[/Quote]
那应该是什么路径，我设置的tomcat6.0\conf\server.xml
<Host name="localhost" appBase="webapps"
unpackWARs="true" autoDeploy="true"
xmlValidation="false" xmlNamespaceAware="false">
<Context path="/myapp" reloadable="true" docBase="F:\java\myapp"/>
你的url有问题 你ajax请求的 servlet 的地址不对 当然访问不到了
[/Quote]
那应该是什么路径，我设置的tomcat6.0\conf\server.xml
<Host name="localhost" appBase="webapps"
unpackWARs="true" autoDeploy="true"
xmlValidation="false" xmlNamespaceAware="false">
<Context path="/myapp" reloadable="true" docBase="F:\java\myapp"/>
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 7 楼 Ghost_520 的回复:]
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
这个 Ajax 的 URL 有问题吧，
[/Quote]
什么值都没有弹出来，我也觉得纳闷
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
这个 Ajax 的 URL 有问题吧，
[/Quote]
什么值都没有弹出来，我也觉得纳闷
牙签是竹子的 2009-03-19
- 打赏
- 举报
老黄瓜_ 2009-03-19
- 打赏
- 举报
你的url有问题 你ajax请求的 servlet 的地址不对 当然访问不到了
Ghost_520 2009-03-19
- 打赏
- 举报
function doRequestUsingGET(){
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
这个 Ajax 的 URL 有问题吧，
createXMLHttpRequest();
var queryString = "getAndPostExample?";
queryString = queryString + createQueryString() + "×tamp=" + new Date().getTime();
alert(queryString); // 加上这段代码看看弹出来的是什么值？
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("GET",queryString,true);
xmlHttp.send(null);
}
这个 Ajax 的 URL 有问题吧，
Ghost_520 2009-03-19
- 打赏
- 举报
你看控制台输出 "IS Here" 没，输出了几个，如果一个都没输出的话，则说明前台 Ajax 的地方根本就没有到后台，
检查下代码，看是不是前台的问题。
thefirstwind 2009-03-19
- 打赏
- 举报
调试工具推荐firefox + firebug
fanxinwu 2009-03-19
- 打赏
- 举报
[Quote=引用 3 楼 Ghost_520 的回复:]
在后台输入 System.out.println("IS Here"); 看这句话输出没，就知道有没有到后台。而且后台处理的时候 try{}catch(){} 一下。
[/Quote]
package ajaxbook.chap3;
import java.io.*;
import java.net.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class getAndPostExample extends HttpServlet{
protected void processRequest(HttpServletRequest request,HttpServletResponse response,String method)
throws ServletException,IOException{
//Set content type of the response to text/xml
response.setContentType("text/xml");
//Get the user's input
String firstName = request.getParameter("firstName");
String middleName = request.getParameter("middleName");
String birthday = request.getParameter("birthday");
//Create the response text
String responseText = "Hello " + firstName + " " + middleName + ".Your birthday is " + birthday + "."
+ "[Method:" + method + "]";
//Write the response back to the browser
PrintWriter out = response.getWriter();
System.out.println("IS Here");
out.println(responseText);
//Close the writer
out.close();
}
protected void doGet(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
System.out.println("IS Here");
processRequest(request,response,"GET");
}
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
System.out.println("IS Here");
processRequest(request,response,"POST");
}
}
是像上面红色那样添加吗？然后生成getAndPostExample.java文件，
点击html里的按钮，还是一点反应都没有，有谁能告诉我怎么做吗？
在后台输入 System.out.println("IS Here"); 看这句话输出没，就知道有没有到后台。而且后台处理的时候 try{}catch(){} 一下。
[/Quote]
package ajaxbook.chap3;
import java.io.*;
import java.net.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class getAndPostExample extends HttpServlet{
protected void processRequest(HttpServletRequest request,HttpServletResponse response,String method)
throws ServletException,IOException{
//Set content type of the response to text/xml
response.setContentType("text/xml");
//Get the user's input
String firstName = request.getParameter("firstName");
String middleName = request.getParameter("middleName");
String birthday = request.getParameter("birthday");
//Create the response text
String responseText = "Hello " + firstName + " " + middleName + ".Your birthday is " + birthday + "."
+ "[Method:" + method + "]";
//Write the response back to the browser
PrintWriter out = response.getWriter();
System.out.println("IS Here");
out.println(responseText);
//Close the writer
out.close();
}
protected void doGet(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
System.out.println("IS Here");
processRequest(request,response,"GET");
}
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException{
//Process the request in method processRequest
System.out.println("IS Here");
processRequest(request,response,"POST");
}
}
是像上面红色那样添加吗？然后生成getAndPostExample.java文件，
点击html里的按钮，还是一点反应都没有，有谁能告诉我怎么做吗？
Ghost_520 2009-03-18
- 打赏
- 举报
在后台输入 System.out.println("IS Here"); 看这句话输出没，就知道有没有到后台。而且后台处理的时候 try{}catch(){} 一下。
fanxinwu 2009-03-18
- 打赏
- 举报
怎样看程序到后台没
[Quote=引用 1 楼 Ghost_520 的回复:]
1. 当你点击 Send parameters using GET 看看程序到后台没。
2. 看看当 Ajax 返回， 在回调函数里 alert(返回值); 看看弹出来的是什么？
要一步步的测试出问题出现在哪里，你能准确的找错问题出在哪里，我们才能更快速，更准确的帮你解决问题。
[/Quote]
[Quote=引用 1 楼 Ghost_520 的回复:]
1. 当你点击 Send parameters using GET 看看程序到后台没。
2. 看看当 Ajax 返回， 在回调函数里 alert(返回值); 看看弹出来的是什么？
要一步步的测试出问题出现在哪里，你能准确的找错问题出在哪里，我们才能更快速，更准确的帮你解决问题。
[/Quote]
Ghost_520 2009-03-18
- 打赏
- 举报
1. 当你点击 Send parameters using GET 看看程序到后台没。
2. 看看当 Ajax 返回， 在回调函数里 alert(返回值); 看看弹出来的是什么？
要一步步的测试出问题出现在哪里，你能准确的找错问题出在哪里，我们才能更快速，更准确的帮你解决问题。
