您的位置：首页 > Web前端 > JQuery

jquery+ajax实现倒计时动态显示效果。

2012-05-05 16:47 615 查看

前台页面：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<base href="<%=basePath%>">

<title>My JSP 'time_view2.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">



<script type="text/javascript" src="../js/jquery/jquery-1.5.1.min.js"></script>

</head>

<script>

//倒计时显示方法

function getTimeNum(){

$.ajax({

url: "/event/2012flower/test.jsp?t==="+new Date(),

type: "GET",

dataType: "text",

success: function(data){

//alert("time="+data);

$("#showTimes").html(""+data);

}

});

}

</script>

<body>

<div id="showTimes"></div>

<script>

window.setInterval("getTimeNum()", 1000);

</script>

</body>

</html>

后台服务页面:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

//当前时间毫秒数

Long current_time1=System.currentTimeMillis();

//结束时间毫秒数

Long end_time2=1337875200000l;

//计算时间差

Long time2=end_time2-current_time1;

//转换为秒数

int second=(int)(time2/1000); //剩余总秒数

//将秒数专为天数

int s = second % 60; // 秒

int mi = (second - s) / 60 % 60; // 分钟

int h = ((second - s) / 60 - mi ) / 60 % 24; // 小时

int d = (((second - s) / 60 - mi ) / 60 - h ) / 24; // 天

String ret= "剩余：" + d + "天" + h + "小时" + mi + "分钟" + s + "秒";

//System.out.println(ret);

%>

<%=ret %>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航