秒殺倒計時封裝總結

   /*
				功能:兩個日期的時間差
				參數:
					start 開始時間  Date類型的對象
					end   結束時間  Date類型的對象
				返回值:返回一個對象(Object類型)
			 */
    <style>
		span{
			display: inline-block;
			width: 40px;
			height: 40px;
			line-height: 40px;
			margin-right: 10px;
			background-color: pink;
			color: #fff;
			text-align: center
		}
    </style>
        <span id="day">0</span>
		<span id='hours'>0</span>
		<span id='minute'>0</span>

function getDiff(start,end) {
// 1.創建一個開始的時間對象
// var start = new Date();
// 2.創建要一個未來時間對象
// var end = new Date(‘2019/7/10 22:18:18’);
// 3.求兩個日前的時間差(差多少毫秒)
var temp = end.getTime() - start.getTime();

				var date = parseInt(temp / 1000 / 60 / 60 / 24);  //天
				if(date>9){
					date=date
				}else{
					date='0'+date
				}
				var hours = parseInt(temp / 1000 / 60 / 60 % 60); // 小時
				if(hours>9){
					hours=hours
				}else{
					hours='0'+hours
				}
				var minute = parseInt(temp / 1000 / 60 % 60); // 分鐘
				if(minute>9){
					minute=minute
				}else{
					minute='0'+minute
				}
				var seconds = parseInt(temp / 1000 % 60);  // 秒
				if(seconds>9){
					seconds=seconds
				}else{
					seconds='0'+seconds
				}
				var milliSecond = temp % 1000;   // 毫秒

				var obj = {
					date:date,
					hours:hours,
					minute:minute,
					seconds:seconds,
					milliSecond:milliSecond
				};
				return obj;
			}

			setInterval(function() {
			var s = new Date();
			var e = new Date('2019/6/14 13:12:12');
			var r = getDiff(s,e);
			if(e>=s){
				$('#day').text(r.date);
				$('#hours').text(r.hours);
				$('#minute').text(r.minute);
			}
			return false;

			}, 1000);
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章