Nhận ngày xuất hiện tiếp theo của ngày và giờ trong javascript

Question

Tôi đang cố gắng triển khai đồng hồ đếm ngược đến một thời điểm cụ thể trong tương lai. Thời điểm này luôn luôn là cùng một ngày trong tuần và giờ, và được dựa trên thời gian UTC.

Tôi đang cố gắng viết một chức năng chung cho một ngày trong tuần và một giờ, nó sẽ trả về một đối tượng ngày đại diện cho tiêu chí đó trong tương lai.

Ví dụ:

getNextOccuranceOfUTCDayAndHour(1, 7);

Lấy xuất hiện tiếp theo của 7 giờ sáng ngày thứ Hai. Nếu hôm nay là Monday, 25/5/2015 @ nửa đêm UTC, thì hàm này sẽ trả về một đối tượng Date đại diện cho Thứ Hai 6/1/2015 7 giờ sáng UTC.

getNextOccuranceOfUTCDayAndHour(3, 13);

Nhận sự kiện tiếp theo là 1 giờ chiều vào thứ Tư. Nếu hôm nay là Thứ Ba, 26/5/2015 @ nửa đêm UTC, thì chức năng này sẽ trả về một đối tượng Ngày đại diện cho Thứ Tư 5/27/2015 1 giờ tối theo giờ UTC.

Tôi đã cố gắng viết một chức năng để thực hiện việc này và tôi đã đưa đoạn mã vào bên dưới, nhưng dường như nó chỉ hoạt động trong một số ngày chứ không phải những ngày khác. Nó cực kỳ không đáng tin cậy. Tôi không muốn sử dụng Moment.js.

function getNextOccuranceOfUTCDayAndHour(day, hour) { 
 
    d = new Date(); 
 
    d.setDate(d.getUTCDate() + (7 + day - d.getUTCDay()) % 7) 
 
    d.setUTCHours(hour, 0, 0, 0); 
 
    return d; 
 
} 
 

 
function format_seconds(t) { 
 
    var d = Math.floor(t/86400); 
 
    var h = Math.floor(t % 86400/3600); 
 
    var m = Math.floor(t % 3600/60); 
 
    var s = Math.floor(t % 3600 % 60); 
 
    return ((d > 0 ? d + " d. " : "") + 
 
    (h > 0 ? h + " h. " : "") + 
 
    (m > 0 ? m + " m. " : "") + 
 
    s + " s."); 
 
} 
 

 
function update() { 
 
    var next_occurance = getNextOccuranceOfUTCDayAndHour(1, 7); 
 
    $('#next_occurance').text(next_occurance); 
 
    var ms = next_occurance - new Date(); 
 
    $('#countdown').text(format_seconds(Math.floor(ms/1000))); 
 
} 
 

 
$(function() { 
 
    update(); 
 
    setInterval(update, 1000); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p id="next_occurance">Next Occurance</p> 
 
<p id="countdown">Countdown</p>

Edit: Một số ví dụ về so với dự kiến ​​quay trở lại giá trị. JSFiddle

Answer 1

Sự cố trong mã ban đầu là sử dụng d.setDate(); thay vì d.setUTCDate();. Ngoài ra, nếu ngày hiện tại là cùng ngày trong tuần làm ngày mục tiêu thì kết quả không chính xác. Chỉ cần thêm câu lệnh if để kiểm tra trường hợp này khắc phục sự cố đó.

Đã cập nhật JSFiddle: https://jsfiddle.net/2j49q0ak/1