2017-05-24 2 views
0

Ich brauche ein kleines Skript und ich bin ein wenig verwirrt.jQuery Countdown bekommen Zeit bis 10:00 Uhr heute oder morgen

Ich möchte dieses Plugin verwenden: http://keith-wood.name/countdown.html

Ziel: Haben Sie einen Countdown, die von jetzt bis 10:00 Uhr zählt - wenn es 0-9 ist: 59: 59 Uhr bis 10 Uhr Zahl heute, wenn Es ist nach 10:00 Uhr morgen bis 10:00 Uhr. Ist das verständlich?

Hier ist, was ich mit Javascript/jquery müssen (das wird nicht funktionieren, ich weiß):

var currentDate = new Date(new Date().getTime()); 
var hours = currentDate.getHours(); 
var endTime; 
    if(hours >= 10){ 
     endTime = give me next day 10:00 
    } else { 
     endTime = give me this day 10:00 
    } 
$("#countdown").countdown({until: endTime, format: 'HMS'}); 
+0

Bitte überprüfen Sie es https://stackoverflow.com/questions/1787939/check-time-difference-in-javascript –

Antwort

2

Folgende Arbeiten sollten (console.log() zu Testzwecken hinzugefügt wurde). Beachten Sie, dass die Zeitzone des Browsers anstelle der UTC-Zeit verwendet wird.

var currentDate = new Date(new Date().getTime()); 
 
var hours = currentDate.getHours(); 
 
var endTime = new Date(currentDate); 
 
endTime.setMinutes(0); 
 
endTime.setSeconds(0); 
 
endTime.setHours(10); 
 

 
if(hours >= 10){ 
 
    endTime.setDate(endTime.getDate() + 1); 
 
} 
 
console.log(endTime); 
 
$("#countdown").countdown({until: endTime, format: 'HMS'});

+0

helfen kann es für den nächsten Tag arbeitet, aber nicht für den heutigen Tag. Wenn Sie 10 Uhr auf 12 oder später ändern, funktioniert das nicht mehr ... – MrLumbergh

+0

Stellen Sie sicher, dass Sie die 10 bis 12 beide in der Zeile "endTime.setHours()" UND in der Zeile "hours> = 10" ändern. Beachten Sie auch, dass Ihre aktuelle Zeitzone verwendet wird. – thepieterdc

+0

Ohhh! Vielen Dank. – MrLumbergh

0

Wenn Sie am nächsten Tag müssen dann das aktuelle Datum erhöhen, dann Jahr, Monat, Tag passieren und Stunden (statisch 10) das Enddatum zu erstellen.

$(function() { 
 
    var currentDate = new Date(); 
 
    var hours = currentDate.getHours(); 
 
    var day; 
 
    
 
    if(hours >= 10){ 
 
     day = currentDate.getDate() + 1; 
 
    } else { 
 
     day = currentDate.getDate(); 
 
    } 
 
    
 
    var endTime = new Date(currentDate.getFullYear(), currentDate.getMonth(), day, 10); 
 
    $("#countdown").countdown({until: endTime, format: 'HMS'}); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.plugin.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.min.css" /> 
 

 
<div id='countdown'></div>

0

Sie können es auf diese Weise behandeln.

currentDate.setHours(10,00,00); 
if(hours >= 10){ 
    endTime = currentDate.AddDays(1); 
} 
0

Dies ist die Funktion, die ich für meine Website verwenden:

function countDown(id, date = "Jan 5 2018") { 
    var int = setInterval(function() { 
    // Get todays date and time 
    var now = new Date().getTime(); 

    // Find the distance between now an the count down date 
    var distance = date - now; 

    // Time calculations for days, hours, minutes and seconds 
    var days = Math.floor(distance/(1000 * 60 * 60 * 24)); 
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24))/(1000 * 60 * 60)); 
    var minutes = Math.floor((distance % (1000 * 60 * 60))/(1000 * 60)); 
    var seconds = Math.floor((distance % (1000 * 60))/1000); 

    // Display the result in the element with id="demo" 
    document.getElementById(id).innerHTML = days + "d " + hours + "h " 
              + minutes + "m " + seconds + "s "; 

    // If the count down is finished, write some text 
    if (distance < 0) { 
     clearInterval(x); 
     document.getElementById(id).innerHTML = "00d 00h 00m 00s"; 
    } 
    }, 1000); 

    return int; 
} 

Im date Parameter, müssen Sie Ihr Datum und Uhrzeit eingeben (ex 1. Januar 2018 00.00.00.) und im Parameter id den ID-Selektor (nicht '#myid', sondern nur den Namen 'myid').

Ich hoffe, das kann nützlich sein.

Sie können es in Aktion sehen, diese Frage here

Verwandte Themen