<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<title>testc</title>
<script>
jQuery(document).ready(function(){
//顯示時間，以后應用於自動定時器做某一件事
jQuery("div[id^=auto_order_cancel]").each(function(index, element) {
var val=jQuery(this).attr("mark");
var status=jQuery(this).attr("status");
timeCount(val,status,"1");
});
});
function timeCount(remain_id,status){
function _fresh(){
var nowDate = new Date();//當前時間
var id=jQuery('#'+remain_id).attr("order_id"); //當前訂單的id
var addTime=new Date(jQuery('#'+remain_id).attr('addTime'));//下單開始時間
var auto_order_cancel=jQuery('#'+remain_id).attr('auto_order_cancel');//訂單支付有效時長
var auto_totalS=parseInt(auto_order_cancel*60*60);
var ad_totalS = parseInt((addTime.getTime()/1000)+auto_totalS); ///下單總秒數
var totalS = parseInt(ad_totalS-(nowDate.getTime()/ 1000));///支付時長
if(status == 10){
if(totalS>0){
var _hour = parseInt((totalS / 3600) % 24);
var _minute = parseInt((totalS / 60) % 60);
var _second = parseInt(totalS % 60);
jQuery('#status_'+remain_id).html('剩余'+_hour+'時'+_minute+'分'+_second+'秒');
jQuery('#ico_'+remain_id).show();
}else{//支付超時
jQuery('#status_'+remain_id).html('');
jQuery('#ico_'+remain_id).hide();
clearInterval(sh);
jQuery.ajax({
type:'POST',
url:"http://取消訂單的路徑",
data:{"id":id},
success:function(data){
window.location.href="http://localhost:8080/buyer/order.htm";
}
});
}
}
}
_fresh();
var sh = setInterval(_fresh,1000);
}
</script>
<style>
.time_icon{
display: inline-block;
width: 15px;
height: 15px;
text-align: center;
margin-bottom: 5px;
margin: 0px 3px 0px 0px;
vertical-align: middle;
overflow: hidden;
background: url(./img/cont_time.png) no-repeat;
}
</style>
</head>
<body>
<!-- status=10 為訂單為已下單未支付 addtime:下單時間 auto_order_cancel=24 自動取消時間 -->
<div class="count_time" _val="85542"
id="auto_order_cancel" mark="auto_order_cancel"
order_id="420" status="10" addtime="06/22/2016 08:34:49"
auto_order_cancel="24">
<span class="time_icon" id="ico_auto_order_cancel"></span><i id="status_auto_order_cancel" style="font-style: normal;"></i>
</div>
</body>
</html>
看一下效果圖吧
這個時間會自己倒計時嘿嘿，希望幫到你