用alert调试ajax

最新推荐文章于 2021-08-06 03:55:53 发布

刘利新西安

最新推荐文章于 2021-08-06 03:55:53 发布

阅读量677

点赞数

分类专栏：网页

网页专栏收录该内容

53 篇文章 0 订阅

订阅专栏

如果<p>元素给个id,然后用getElementById显示servelt里面的内容，那么，内容就不能有<h>这种元素，否则只能用div

<servlet>
		<servlet-name>dataSer</servlet-name>
		<servlet-class>FuSheng.DataServlet</servlet-class>
	</servlet>

	<servlet-mapping>
		<servlet-name>dataSer</servlet-name>
		<url-pattern>/data.do</url-pattern>
	</servlet-mapping>

<html>
<head>
<title>AJAX</title>
<script>
	var xmlhttp = new XMLHttpRequest();

	function UpdateData() {
		alert("I got in");
		xmlhttp.onreadystatechange = callback;
		alert("set onready");
		xmlhttp.open("GET", "data.do", true);
		alert("open");
		xmlhttp.send(null);
		alert("sent!!");
	}

	function callback() {
		alert("in call back");
		//if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			alert("in if");
			//document.getElementById("dataDiv").innerHTML = "<h3>CHANGE HAS COME</h3>";
			document.getElementById("1").innerHTML = xmlhttp.responseText;
		} else {
			document.getElementById("dataDiv").innerHTML = "<h3>CHANGE HASN'T COME</h3>";
			alert("Error in AJAX");
		}
	}
</script>
</head>

<body>

	<div id="buttonDiv">
		<button type="Button" οnclick="UpdateData()">Update Data</button>
	</div>
	<br>
	<div id="dataDiv">
		<h3>Some data</h3>
	</div>
	<p id="1">

		<button type="Button" οnclick="UpdateData()">Every ID must
			have it's own button</button>
	</p>
</body>
</html>

package FuSheng;
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.IOException;
import java.io.PrintWriter;

public class DataServlet extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response) {
		try {
			response.setContentType("text/html");
			response.setHeader("Cache-Control", "no-cache");
			PrintWriter out = response.getWriter();
			out.print("if with h element,p does not work ! h3>DATA HAS BEEN CHANEGD/h3>");
			System.out.println("I WAS HERE");
		} catch (IOException io) {
			io.printStackTrace();
		}
	}
}

原文： http://www.coderanch.com/t/545782/HTML-CSS-JavaScript/AJAX-call-servlet

源代码：http://pan.baidu.com/share/link?shareid=484492&uk=3878681452