zoukankan      html  css  js  c++  java
  • jquery实现前台倒计时。应用下单24小时后自动取消该订单

    <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;
    				 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>
    

      

    看一下效果图吧

    这个时间会自己倒计时嘿嘿,希望帮到你

  • 相关阅读:
    解决ubuntu中zip解压的中文乱码问题
    GCC 静态库和动态库
    交互式shell和非交互式shell、登录shell和非登录shell的区别
    牛顿迭代法实现平方根函数sqrt
    Sqrt函数高效实现
    Http、tcp、Socket连接区别
    C++11的一般概念——The C++ standard library, 2nd Edition 笔记(二)
    C++11新特性——The C++ standard library, 2nd Edition 笔记(一)
    【Java线程与内存分析工具】VisualVM与MAT简明教程
    Java设计模式:Proxy(代理)模式
  • 原文地址:https://www.cnblogs.com/wangxiangstudy/p/5607056.html
Copyright © 2011-2022 走看看