.getTime, когда $ (документ). готов к обратному отсчету

Я хочу сделать обратный отсчет. Вот алгоритм:

var timeFinish, timeStart, timeNow, duration

timeStart <- the time when the document has ready

timeFinish <- timeStart + 1hour

timeNow <- get the time everytime (every second)

duration <- timeFinish - timeNow

output (duration)

Я сознательно не писал алгоритм преобразования его в секунду и т. д. (В целях сокращения, и я надеюсь, вы понимаете, что я имею в виду). Вот мой код

$(document).ready(function() {
  setInterval(countdown(), 1000);

  function countdown() {
    var hStart = new Date($(document).ready).getHours;
    var mStart = new Date($(document).ready).getMinutes;
    var sStart = new Date($(document).ready).getSeconds;

    var secondTotalStart = (hStart * 3600) + (mStart * 60) + sStart;
    var secondTotalFinish = secondTotalStart + 3600;

    var hRunning = new Date().getHours;
    var mRunning = new Date().getMinutes;
    var sRunning = new Date().getSeconds;
    var secondTotalRunning = (hRunning * 3600) + (mRunning * 60) + sRunning;

    var duration = secondTotalFinish - secondTotalRunning;

    var h = Math.floor(duration / 3600);
    var m = Math.floor(duration % 3600) / 60;
    var s = Math.floor(duration % 3600) % 60;

    $("#countdown").html(h + " h : " + m + " m : " + s + " s");
  }
});
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "countdown"></div>

И у меня вопрос, как получить timeStart? И мой код неправильный?

Это должно быть setInterval (обратный отсчет, 1000); также почему вы пытаетесь передать $ (document) .ready в конструктор объекта Date?

Esko 17.09.2018 14:25

потому что я не знаю, как получить время, когда документ будет готов :)

Tiara 17.09.2018 14:58

Добавляя к тому, что сказал @Esko, вы вычисляете время начала каждый раз, когда выполняется ваш цикл. Вначале вы должны сделать это только один раз.

user9886608 17.09.2018 14:59
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
3
305
2

Ответы 2

$(document).ready(function() {
var dTime = new Date(); //need to store the on-load time before set interval as a reference
	setInterval(countdown, 1000);

  function countdown() {
    var hStart = dTime.getHours();//need to get the on-load hr, min and sec from the previously stored time.
    var mStart = dTime.getMinutes();
    var sStart = dTime.getSeconds();


    var secondTotalStart = (hStart * 3600) + (mStart * 60) + sStart;
    var secondTotalFinish = secondTotalStart + 3600;

		var running = new Date()// store the current time into a variable
    var hRunning = running.getHours();
    var mRunning = running.getMinutes();
    var sRunning = running.getSeconds();
    var secondTotalRunning = (hRunning * 3600) + (mRunning * 60) + sRunning;

    var duration = secondTotalFinish - secondTotalRunning;

    var h = Math.floor(duration / 3600);
    var m = Math.floor(duration % 3600) / 60;
    var s = Math.floor(duration % 3600) % 60;

    $("#countdown").html(h + " h : " + m + " m : " + s + " s");
  }
});
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "countdown"></div>

Сделал мелкие исправления. надеюсь это поможет

редактировать: добавил несколько полезных комментариев.

Почему голосование против? Я просто исправил ответ в том же формате, который вы написали. Так что вы знаете, где я все поправил. Если вы не хотите отмечать это как ответ, зачем вам голосовать против ?!

Dinesh Thamby 18.09.2018 09:04

Вероятно, автор вопроса не проголосовал против вас. Я думаю, что кто-то сделал это, потому что ответы кода (Только) не так полезны, если вы немного не объясните, что вы это сделали и почему.

user9886608 23.09.2018 11:01

Я исправил ваш код, чтобы вы могли видеть ошибки:

$(document).ready(function() {
  //below line: you must pass countdown as a function
  setInterval(countdown, 1000);
  var dt = new Date(); //get this out of countdown function
  var hStart = dt.getHours();
  var mStart = dt.getMinutes();
  var sStart = dt.getSeconds();
  var secondTotalStart = (hStart * 3600) + (mStart * 60) + sStart;
  var secondTotalFinish = secondTotalStart + 3600;

  function countdown() {
    var cdt = new Date();
    var hRunning = cdt.getHours();
    var mRunning = cdt.getMinutes();
    var sRunning = cdt.getSeconds();
    var secondTotalRunning = (hRunning * 3600) + (mRunning * 60) + sRunning;
    var duration = secondTotalFinish - secondTotalRunning;
    var h = Math.floor(duration / 3600);
    var m = Math.floor(duration % 3600 / 60);
    var s = Math.floor(duration % 3600) % 60;
    $("#countdown").html(h + " h : " + m + " m : " + s + " s");
  }
});
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "countdown"></div>

Почему против? Это сам ваш ответ, что его проблемы были решены и отлично работает !!

Hassan Sadeghi 18.09.2018 04:54

Спасибо @Esko за то, что поместили код как встроенный snippet. Я набрал его на своем мобильном телефоне, где у меня нет доступа к редактору кода stackoverflow на нем. установка внешней тестовой ссылки (fiddle) была потому, что это :)

Hassan Sadeghi 18.09.2018 07:26

Другие вопросы по теме