JavaWeb09-HTML篇筆記(三)
阿新 • • 發佈:2018-05-21
java1.1 案例二:登錄成功以後5秒鐘跳轉到另一個頁面.1.1.1 需求:
在登錄成功後,頁面5秒鐘跳轉到其他的一個頁面.
1.1.2 分析:1.1.2.1 技術分析:
【使用Http協議中的Refresh頭信息】
Refresh之前已經介紹可以定時頁面跳轉.需要使用程序設置頭信息才可以.
【response中設置響應頭】
在登錄成功後,頁面5秒鐘跳轉到其他的一個頁面.
1.1.2 分析:1.1.2.1 技術分析:
【使用Http協議中的Refresh頭信息】
Refresh之前已經介紹可以定時頁面跳轉.需要使用程序設置頭信息才可以.
【response中設置響應頭】
* addHeader(String name,String value); --- 針對一個key對應多個value的響應頭. * addDateHeader(String name,long date); * addIntHeader(String name,int value); * setHeader(String name,String value); --- 針對一個key對應一個value的響應頭. * setDateHeader(String name,long date); * setIntHeader(String name,int value); 例如:頭信息: xxx:aaa * addHeader(“xxx”,”bbb”); -->xxx:aaa,bbb * setHeader(“xxx”,”bbb”); -->xxx:bbb
1.1.3 代碼實現:
在登錄成功後的代碼上,定時的跳轉.
public class UserRefreshServlet extends HttpServlet { private static final long serialVersionUID = 1L; protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { try { // 解決向頁面輸出中文的亂碼問題!!! response.setContentType("text/html;charset=UTF-8"); // 1.接收表單提交的參數. String username = request.getParameter("username"); String password = request.getParameter("password"); // 2.封裝到實體對象中. User user = new User(); user.setUsername(username); user.setPassword(password); // 3.調用業務層處理數據. UserService userService = new UserService(); User existUser = userService.login(user); // 4.根據處理結果顯示信息(頁面跳轉). if(existUser == null){ // 登錄失敗 response.getWriter().println("<h1>登錄失敗:用戶名或密碼錯誤!~</h1>"); }else{ // 登錄成功 // response.getWriter().println("Login Success..."); response.getWriter().println("<h1>登錄成功!您好:"+existUser.getNickname()+"</h1>"); response.getWriter().println("<h3>頁面將在5秒後跳轉!</h3>"); response.setHeader("Refresh", "5;url=/day09/demo5-refresh/index.html"); } } catch (Exception e) { e.printStackTrace(); } } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }
1.1.4 總結:1.1.4.1 使用JS控制讀秒的效果.
<script type="text/javascript">
var time = 5;
window.onload = function(){
setInterval(‘changeTime()‘,1000);
}
function changeTime(){
time--;
document.getElementById("s1").innerHTML = time;
}
</script>
JavaWeb09-HTML篇筆記(三)