实现未支付订单倒计时

实现效果：

前端遍历代码:

<div class="dkuang deng">
						<#if orderList?? && orderList?size gt 0>
							<#list orderList as order>
								<#if order.status == 0>
									<p class="one">待支付  支付倒计时:<span id="${order.getOid()?c}">${order.getDjs()}</span></p>
									<div class="word clearfix">
										<ul class="fl clearfix">
											<li>${order.getCreateDate()}</li>
											<li>${order.getPerson()}</li>
											<li>订单号:${order.oid?c}</li>
											<li>在线支付</li>
										</ul>
										<p class="fr">订单金额：<span>${order.getTotal()}</span>元</p>
									</div>
									<div class="shohou clearfix">
										<a href="#" class="fl"><img width="68.99px" height="68.99px" src="${orderItemList[0].getGoodsImg()}"/></a>
										<p class="fl"><a href="#">${orderItemList[0].getGoodsName()}</a><a href="#">¥${orderItemList[0].getGoodsPrice()}×${orderItemList[0].getQuantity()}</a></p>
										<p class="fr">
											<a href="${ctx}/order/add?oid=${order.getOid()?c}&total=${order.getTotal()}">去支付</a>
											<a href="/orderItem/xq/${order.oid?c}">订单详情</a>
										</p>
									</div>
								</#if>
							</#list>
						</#if>

					</div>

使用ajax局部页面刷新方法:
因为是使用freemaker的list遍历，所以我们使用ajax局部页面刷新的时候用动态id值来绑定，以此实现局部时间刷新

<script>


	this.setInterval(function (){
		djs();
	},1000);

	function djs(){
		$.post('/order/OrderList',{},function (rs){
			$.each(rs.data,function (k,v){
				$('#'+v.oid).html(v.djs);
			});
		},'json');
	}
</script>

最后

以上就是谦让发箍为你收集整理的实现未支付订单倒计时的全部内容，希望文章能够帮你解决实现未支付订单倒计时所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。