Cronometru cu numărătoare inversă de 15 minute (Programare, Javascript, Numărătoare Inversă, Countdowntimer)

Syed Qadri a intrebat.
a intrebat.

Desfășor un webinar „just in time”, în cadrul căruia webinarul va fi prezentat la fiecare „15, 30, 45 și 60 de ore după oră.

Am un cronometru de numărătoare inversă configurat pentru a număra până la următorul sfert de oră, dar vreau, de asemenea, ca textul să afișeze ceva de genul:

„Următorul webinar la 10:15AM”.

În momentul de față, textul afișează întotdeauna ora de la începutul orei. Cum ar fi 10:00AM sau 6:00PM, și nu afișează intervalele de 15, 30 sau 45.

Întrebarea mea este: Cum pot configura textul pentru a afișa ora corectă pentru următorul webinar și cum pot configura numărătoarea inversă pentru a afișa numărătoarea inversă până la următorul sfert de oră?

Iată codul:

Comentarii

  • Deci, care este întrebarea? Este cum se afișează ora la fiecare 15 minute? Întrebarea dvs. este etichetată greșit, este vorba de jQuery, nu doar de javascript –  > Por Matthew Lagerwey.
  • jQuery este javascript –  > Por Jaromanda X.
2 răspunsuri
Bishwa Timilsina

Trebuie doar să copiați și să lipiți următorul cod

<!-- Display the countdown timer in an element -->
<p id="demo"></p>

<script>
// Set the date we're counting down to
var countDownDate = new Date().getTime() + 15 * 60 * 1000;

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();

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

  // Time calculations for hours, minutes and seconds
  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("demo").innerHTML =  hours + ":"
  + minutes + ":" + seconds;

  // If the count down is finished, write some text
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);
</script>

Comentarii

  • Vă mulțumesc foarte mult! Codul dvs. este simplu și util pentru mine. –  > Por Hottabov.
  • @Hottabov Sunt fericit pentru că am putut ajuta. –  > Por Bishwa Timilsina.
Aleksey Kuznetsov

Întrebarea este lipsa unor detalii importante despre scripturile externe de care aveți nevoie. Bănuiesc că folosiți „moment.js”, dar nu puteți identifica scriptul pe care îl folosiți pentru a afișa numărătoarea inversă.

În orice caz, codul pe care îl căutați (pentru a calcula următoarea perioadă de start) este următorul:

var next = new Date(); // now
next.setTime(next.getTime() + 15 * 60 * 1000) // add 15 minutes
next.setMinutes(15 * Math.floor(next.getMinutes() / 15)) // rounding to the start of quarter or hour
next.setSeconds(0) // the period starts in 00 seconds of minute.

// format the output
next = moment(next).format('h:mm A')

// ... and display the next quarter of hour with
$('#some_output_div').text(next)