主要是兩個頁面。
一:get.html頁面:
<!DOCTYPE html>
<html>
<head>
<title>xing</title>
<meta charset="UTF-8">
</head>
<body>
<!--<h3>學生信息查詢系統</h3>
學號:<input type="text" id="sno"><input type="button" value="查詢" onclick="show(sno.value)"><br>
<br>
<h3 id="msg"></h3>-->
學號:<input type="text" id="sno"><br>
<input type="button" value="查詢" onclick="show(sno.value)"><br>
<h3 id="msg"></h3>
<script>
function show(id) {
var a = new XMLHttpRequest();
//狀態值的改變
a.onreadystatechange = function () {
//200網址的狀態碼 和404類似,200代表成功找到 ,404找不到文件
//xmlHttpRequest對象讀取響應結束 4 a.readyState==4
if (a.status == 200 && a.readyState == 4) {
//響應輸出
//alert(a.responseText)
document.getElementById("msg").innerHTML = a.responseText;
}
}
//準備通信
a.open('GET', '/save.action?id=' + id);
//開始向服務器通信
a.send();
}
</script>
</body>
</html>
二:Save.java
package com.zit.servlet;
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 java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
@WebServlet("/save.action")
public class Save extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
try {
Class.forName("com.mysql.cj.jdbc.Driver");
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/dt_game?useSSL=false&serverTimezone=PRC&user=root&password=");
PreparedStatement pst = conn.prepareStatement("select * from stu where id=? order by score desc limit 1");
pst.setInt(1, Integer.parseInt(req.getParameter("id")));
ResultSet rs = pst.executeQuery();
resp.setContentType("text/html;charset=utf-8");
PrintWriter out = resp.getWriter();
String n = "";
int score = 0;
if (rs.next()) {
n = rs.getString("name");
score = rs.getInt("score");
out.print(n);
out.print(score);
} else {
n = "無此學生信息";
out.print(n);
}
out.flush();
out.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
完成。。。。
補充點東西:
ajax時鐘顯示:
t.jsp
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<%
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
out.print(sdf.format(new Date()));
%>
</body>
</html>
time.html文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.3.1.js"></script>
<script>
$(function () {
setInterval(function () {
$("#msg").load('t.jsp');
},1000)
})
</script>
</head>
<body>
<h3>alert時鐘顯示</h3>
<h3 id="msg"></h3>
</body>
</html>