使用jQuery檢查當前時間是否落入時間範圍（24小時）

Question

這不是日期，而是時間。

不知道你怎麼可能把兩者混淆

我有什麼到目前爲止做：

此刻，我可以計算出當前時間是否落在只要時間範圍因爲它不是00:00（12AM）或更晚。

這是因爲我目前的狀況，如果僅着眼於：

current time > startTime and current time < endTime

if (currentTime > startTime && currentTime < endTime) { 
    green 
} else { 
    red 
} 

請參閱我已經包括更好地瞭解這一問題的片段。

var shiftStartWorking = '00:00', 
 
    shiftEndWorking = '08:00', 
 
    shiftStartNotWorking = '17:00', 
 
    shiftEndNotWorking = '00:00'; 
 

 
$('#current').text(moment().format('HH:mm')); 
 

 
if (moment().format("HH:mm") > shiftStartWorking && moment().format("HH:mm") < shiftEndWorking) { 
 

 
    $('#working').attr('style', 'color: green'); 
 

 
} else { 
 

 
    $('#working').attr('style', 'color: red'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script> 
 

 
<div>Current Time: <span id="current"></span> 
 
</div> 
 

 
<br /> 
 

 
<div> 
 
    <span>Working version</span> - 
 
    <span id="working">00:00 - 08:00</span> 
 
</div>

Answer 1

使用的時刻，你可以比較一刻對象，而不是字符串。您可以使用isBetween函數檢查當前時間是否在您的範圍內。

編輯：

時刻對象表示某一特定日期（日期&時間），如圖我的片段反正解析字符串（只傳遞時間值）創建一個對象時刻爲當天。您可以使用這些對象進行比較，因爲它們都指向同一天（按構造）。

編輯＃2： 我已經添加了檢查開始和結束日期之間的關係來處理您在評論中提到的情況。我之前的回答不完整。

編輯＃3： 創建一個函數做比較。

這裏您片段的更新版本：

function isNowBetweenTime(startTime, endTime){ 
 
    // Creating moment objects for the current day at the given time 
 
    var startMom = moment(startTime, 'HH:mm'); 
 
    var endMom = moment(endTime, 'HH:mm'); 
 
    
 
    if (startMom.isAfter(endMom)){ 
 
    endMom.add(1, 'd'); 
 
    } 
 
    
 
    return moment().isBetween(startMom, endMom); 
 
} 
 

 
var shiftStartWorking = '16:00', 
 
    shiftEndWorking = '23:00', 
 
    shiftStartNotWorking = '17:00', 
 
    shiftEndNotWorking ='00:00'; 
 

 
$('#current').text(moment().format('HH:mm')); 
 

 
if(isNowBetweenTime(shiftStartWorking, shiftEndWorking)) { 
 
    $('#working').attr('style', 'color: green'); 
 
} else { 
 
    $('#working').attr('style', 'color: red'); 
 
} 
 

 
if(isNowBetweenTime(shiftStartNotWorking, shiftEndNotWorking)){ 
 
    $('#notWorking').attr('style', 'color: green'); 
 
} else { 
 
    $('#notWorking').attr('style', 'color: red'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script> 
 

 
<div>Current Time: <span id="current"></span> 
 
</div> 
 

 
<br /> 
 

 
<div> 
 
    <span>Working version</span> - 
 
    <span id="working">16:00 - 23:00</span> 
 
</div> 
 

 
<br /> 
 

 
<div> 
 
    <span>Non Working version</span> - 
 
    <span id="notWorking">17:00 - 00:00</span> 
 
</div>