注【相关代码点击这里下载:https://pan.baidu.com/s/1Nzep-O5OUdr9XfQDA8c8PA 密码:m0yt 】
下面是操作步骤:
1.打开记事本,输入以下代码,将文件保存为interActive.html格式2.打开myeclipse(不要用eclipse),新建Servlet类,输入代码,再开启服务器
3.演示效果如下
前台程序代码如下:
<html>
<head>
<meta charset="utf-8"/>
<script>
window.onload =function(){
document.getElementById("btn").onclick = function(){
var ajax;
try{
ajax =new XMLHttpRequest();
}catch(e){
ajax =new ActiveXObject("microsoft.xmlhttp");
}
var url
="http://localhost:8080/interActive/servlet/InterActive";
var method="GET";
ajax.open(method, url,true);
ajax.send();
ajax.onreadystatechange =function(){
if(ajax.readyState==4 && ajax.status==200){
alert(ajax);
var curTime = ajax.responseText;
document.getElementById("time").innerHTML = curTime;
}
}
// alert(ajax);
}
}
</script>
</head>
<body>
<input id="btn" type="button" name="btn" value="Òì²½ÇëÇó"/>
<br>
<span id="time"></span><br>
</body>
</html>
后台程序如下:
package interActive;
import java.io.IOException;
import java.io.PrintWriter;
import java.text.SimpleDateFormat;
import java.util.Date;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class InterActive extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse
response)
throws ServletException, IOException {
Date curTime= new Date();
SimpleDateFormat sf= new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
String format= sf.format(curTime);
response.setContentType("text/html;charset=utf-8");
//
传递数据回页面
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST,GET");
PrintWriter out=response.getWriter();
out.write("
现在时间是:
"+format);
out.close();
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
doGet(req, resp);
}
}
想了解更多,欢迎关注我的微信公众号:“自由学编程”
本文作者b哥。