js 和 java 将时间倒计时显示
需求:用户购买产品,创建了一个订单,但是还么有支付,此时给用户三十分钟剩余支付时间,前台页面做倒计时功能,时间到达时,更改订单状态 ,输出的格式是:29:23
java 实现
package com.project.test; import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date; import org.apache.commons.validator.Var;
import org.junit.Test;
import org.omg.CORBA.PRIVATE_MEMBER; import com.sun.org.apache.xerces.internal.parsers.IntegratedParserConfiguration; import IceInternal.Time;
import sun.util.logging.resources.logging; /*
* @author xiaoyi
* @see 倒计时转化工具类
*/
public class TimeConvert { private final static Long DEFAULT_TIME=(long) (30*60*1000); //超时时间 /*
* @see 将字符串转化为时间格式
*/
public static Date convertStrToDate(String strDate){
Calendar calendar=Calendar.getInstance();
if(strDate != null){
String[] dateAndTime=strDate.split(" ");
String[] dateStr=dateAndTime[0].split("-");
String[] TimeStr=dateAndTime[1].split(":");
calendar.set(Integer.parseInt(dateStr[0]), Integer.parseInt(dateStr[1])-1, Integer.parseInt(dateStr[2]),
Integer.parseInt(TimeStr[0]), Integer.parseInt(TimeStr[1]), Integer.parseInt(TimeStr[2]));
}
return calendar.getTime();
} /*
* 左边添加0
*/
public static String addLeftZero(Long tempNum){
String num="00";
if(tempNum<10){
num="0"+tempNum;
}else if(tempNum==0){
num= "00";
}else{
num=""+tempNum;
} return num;
} /*
* //将毫秒数转化为倒计时 eg :29:30
*/
public static String formatDate(Long num){
String tem="00:00";
if(num>0){
Long minute=num/60/1000;
Long yushu=num%(60*1000);
Long second=yushu/1000;
tem= TimeConvert.addLeftZero(minute)+":"+TimeConvert.addLeftZero(second);
}else{
tem= "00:00";
}
return tem;
} /*
* 计算还剩多少时间
*/
public String calculateTime(String initTime){
String remainTime="00:00"; //剩余时间
if(initTime !=null){
Date nowDate=new Date();
Long timeLength=(long) (TimeConvert.convertStrToDate(initTime).getTime()+DEFAULT_TIME-nowDate.getTime()); //求当时间和下单时间的差(毫秒)
remainTime=TimeConvert.formatDate(timeLength);
}
return remainTime;
} //测试
public static void main(String[] args) {
TimeConvert timeConvert=new TimeConvert();
SimpleDateFormat dateFormat=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
System.out.println(new TimeConvert().calculateTime("2017-12-29 15:09:56"));
} }
将后台的数据传递到jsp页面
,怎么做倒计时,代码如下
var showTimeInterval;
$(function(){
setTimeout(function(){
if($(".needTime").length>0){
liveTime.initData('${orderDetail.ORDERID}');
//定时器,修改订单剩余支付时间
showTimeInterval=window.setInterval(
function(){
liveTime.remindTime($(".needTime").html(),".needTime",".title"); //将倒计时格式
},1000); //每一秒刷新一次
}
},1000) });
创建一个js
livetime.js
/*计算订单的剩余时间*/
var globeNowTime=new Date();
var oderId=null;
var liveTime={
initData:function(orderIdArgs){
oderId=orderIdArgs;
},
convertStrToDate:function(dateString) { //将字符串时间转化
if (dateString) { //2017-12-01 13:12:15
var arg1 = dateString.split(" "); //分割日期和时分秒
var arg2 = arg1[0].split('-');
var arg3= arg1[1].split(':');
var date = new Date(arg2[0], arg2[1]-1, arg2[2],arg3[0],arg3[1],arg3[2]); //分别对应 年 月 日 时 分 秒
return date;
}
},
addLeftZero:function(tempNum){ //两位数,左边补0
if(tempNum<10){
return "0"+tempNum;
}else if(tempNum==0){
return "00";
}else{
return tempNum;
}
},
formatDate:function(num){ //将毫秒数转化为倒计时 eg :29:30
if(num>0){
var minute=parseInt(num/60/1000);
var yushu=num%(60*1000);
var second=parseInt(yushu/1000);
return liveTime.addLeftZero(minute)+":"+liveTime.addLeftZero(second);
}else{
return "00:00";
}
},
updateOrderInfo:function(){ //更新数据库订单状态
var url = "/core/recordExplain.updLiveOrderState.do";
var postData={"orderId":oderId};
$.getMyJSON(url,postData,function(data){
console.info("更新成功");
});
},
globeCalculateTime:function(initTime){ //列表调用此方法 e 传入this
var remainTime="00:00"; //剩余时间
var timeLength=globeNowTime.getTime()-liveTime.convertStrToDate(initTime).getTime(); //求当时间和下单时间的差(毫秒)
remainTime=liveTime.formatDate(timeLength);
return remainTime;
},
calculateTime:function(initTime){ //定时器调用此方法
var remainTime="00:00"; //剩余时间
var nowDate=new Date();
var timeLength=nowDate.getTime()-liveTime.convertStrToDate(initTime).getTime(); //求当时间和下单时间的差(毫秒)
remainTime=liveTime.formatDate(timeLength);
return remainTime;
},
remindTime:function(getTime,className,className2){ //剩余时间倒计时
var tt="00:00";
if(getTime != null){
var tempTime=getTime.split(":");
var timeLength=parseInt(tempTime[0])*60*1000+parseInt(tempTime[1])*1000-1000;
if(timeLength<1000){ //当订单剩余时间小于1 秒的时候,开始更新数据库的订单状态
//TODO something
liveTime.updateOrderInfo(); //更新数据
//并且将定时器关闭
clearInterval(showTimeInterval);
//修改名称
$(""+className2).html("订单失效");
}else{
tt=liveTime.formatDate(timeLength);
} } $(""+className).html(tt);
} }
屏幕已经开始倒计时
js 和 java 将时间倒计时显示的更多相关文章
- 小程序,用js获取当前系统时间并显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 前端js转换时间戳为时间类型显示
//时间戳转换 function add0(m){return m<10?'0'+m:m } function formatDate(timestamp) { //timestamp是整数,否则 ...
- Java 获取当前时间及实现时间倒计时功能
引言 在一些项目中或是一些特殊的业务场景中,需要用到显示系统的当前时间,以及一些固定的时间倒计时,时间到后做一些什么事情的业务 .接下来咱们就具体看看代码是怎么实现的: <%@ page lan ...
- js倒计时显示
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>j ...
- js时间倒计时
看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...
- js获取当前日期时间同时显示星期
JavaScript获取当前日期时间同时显示星期几,具体代码如下: <html> <head> <meta http-equiv="Content-Type&q ...
- 原生js 当前时间 倒计时代码
源:https://www.oschina.net/code/snippet_2318153_54763 <!DOCTYPE html> <html> <head> ...
- Java 日期时间获取和显示
Java正确获取星期Calendar.DAY_OF_WEEKhttp://chamcon.iteye.com/blog/2144433 Java SimpleDateFormat 中英文时间格式化转换 ...
- 在JSP页面里,时间控件的JS位置在下面然后就显示不出来
在JSP页面里,时间空间的JS位置在下面然后就显示不出来,放到前面然后就显示出来了, 情何以堪啊,开始还以为是什么错误.
随机推荐
- Openstack-Ceilometer-获取主机内存 的使用
1. 物理server配置 1.1安装 參考 http://blog.csdn.net/qq_21398167/article/details/47019751 1.2 配置 关闭selin ...
- 【ios系列】-Quartz 2D常用方法介绍
Quartz 2D基本介绍 Quartz 2D是一个二维绘图引擎 能够,绘制图形 : 线条\三角形\矩形\圆\弧等,绘制文字,绘制\生成图片(图像),读取\生成PDF,截图\裁剪图片,自定义UI控件( ...
- WIN7 64位升级更新到IE10或IE11后,IE不能打开
权限问题,已经解决 解决办法: 用regedit打开注册表,找到 HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main 对左侧树Mai ...
- HubbleDotNet 开源全文搜索数据库项目--为数据库现有表或视图建立全文索引(三) 多表关联全文索引模式
关系型数据库中,多表关联是很常见的事情,HubbleDotNet 可以对部分情况的多表关联形式建立关联的全文索引,这样用户就不需要专门建一个大表 来解决多表关联时的全文索引问题. 下面以 为数据库现有 ...
- linux内存管理之uboot第一步
在进入讲解linux内存管理的kernel阶段以前,了解一下uboot阶段是如何准备好内存物理设备的,这是非常有意义的.通常进入到linux内核阶段之后,对内存芯片的物理特性寄存器访问是比较少的,强调 ...
- 洛谷 P1082 同余方程 —— exgcd
题目:https://www.luogu.org/problemnew/show/P1082 用 exgcd 即可. 代码如下: #include<iostream> #include&l ...
- 一种struts标签取不到值的情况
编写一个网页,使用<s:date >标签将日期格式化,使用了多组数据一直没有问题,突然在一组数据上死活出现不了数据了.程序如下 <s:iterator value="art ...
- TensorFlow博客翻译——用TensorFlow在云端进行机器学习
https://github.com/tensorflow/tensorflow 原文地址 Machine Learning in the Cloud, with TensorFlow Wednesd ...
- Excel VBA 入门
一.文件格式 要使用VBA,excel文件必须保存为启用宏的工作簿,即xlsm格式. 二.启动VBA编辑器 打开工作簿后,要启动VBA编辑器,有两种方法,一是在工作表的名字上面点击右键,选择“查看代码 ...
- 可视化工具Grafana部署
随着业务的越发复杂,对软件系统的要求越来越高,这意味着我们需要随时掌控系统的运行情况.因此,对系统的实时监控以及可视化展示,就成了基础架构的必须能力. Grafana官方网站 https://graf ...