js实现页面倒计时效果

   经常需要在页面上倒计时的效果,一般来说倒计时的时间,也就是“限制时间”,应该在后台计算。然后初始化到控件上,然后启动倒计时程序。

  1. 第一步就是从后台取值,然后setTimeout("Times()",1000); 方式执行下面的方法。
  2. 第二步就是计时器里面的逻辑了,这里的倒计时只有分钟和秒,倒计时的具体逻辑来自第一步的取值。
//30分钟倒计时
	function Times(){
	    var tempTime=$("#currTime").text().split(":");
	    var minute=tempTime[0];
	    var second=tempTime[1];
	    if(second>=1){
	        second=(second-1>9)?(second-1):"0"+(second-1);
	    }else{
	        second="59";
	        if(minute>=1){
	            minute=(minute-1>9)?(minute-1):"0"+(minute-1);
	        }else{ 
	            minute="00";
	        }
	    }
	    $("#currTime").text(minute+":"+second);
	    
	    if(minute==0&&second==0){
	        $("#paynow").removeClass("payBtn");
                $("#paynow").addClass("payBtnGrey");
                $("#paynow").attr("disabled","disabled");
            
	        var id = $("#orderId").val();
		    $.ajax({
	            type: "post",
	            url: "XXX",
	            dataType: "text",
	            data:{"XXX},
	            success: function(){
	                $("#prompt").text("XXX超时,系统已自动XXX!");
                        $("#prompt").css("color","#cc0000");
	            }
	        });
	        
	    }else{
	        setTimeout("Times()",1000);
	    }
	}

猜你喜欢

转载自blog.csdn.net/flyfeifei66/article/details/45390287