Как менять данные на кнопке?

Question

[Артем Гартунг]

Столкнулся с такой вот проблемой, имеется некая кнопка в ней выводятся данные 3-х видов: 1) отправить запрос 2) временная метка (сколько времени осталось) 3) получить результат. Все это взаимосвязано с бд.

Интересует очень сильно 2-й пункт (временная метка), как сделать так что бы данные на кнопке обновлялись (формат выводимого времени: 00:00:00), т.е что бы пользователь без обновления страницы видел сколько времени осталось.

Answer 1

[hzzzzl]

setInterval(updateKnopka, 1000)

function updateKnopka() { 
  /* раз в секунду меняет текст */
}

типа такого
https://codepen.io/jmikey/pen/tFHrp

конечно, если время как-то зависит от того, как долго БД будет обрабатывать запрос, и сервер шлет оставшееся время в браузер, то это всё усложняет

Comments

[Артем Гартунг]

Структура этих 3-х вариантов примерно такая вот

<?if(time() >= $mission['time'] && $mission['status'] == 'выполнено'){?>
							<div class="clickMission" onclick="postSend('mission', 'pers')">Выполнить</div><?}
						else if(time() < $mission['time']){?>
							<div class="clickMission"><i class="far fa-clock"></i><?=gmdate("H:i:s", $mission['time']-time())?></div><?}
						else if(time() >= $mission['time'] && $mission['status'] == 'выполняется'){?>
							<div class="clickMission" onclick="result('collect', 'pers')">Получить награду</div><?}
						else{?><div class="clickMission" onclick="postSend('mission', 'pers')">Выполнить</div><?}?>

[hzzzzl]

Артем Гартунг,
ну я вижу так, что сюда надо всунуть JS скрипт, который сразу начнет выполняться и менять текст

else if(time() < $mission['time']){?>

    <div class="clickMission">
      <i class="far fa-clock"></i>
      <span id="timer"> <?=gmdate("H:i:s", $mission['time']-time())?> </span>
    </div>

    <script>
      let time = // сколько секунд осталось, вставить через PHP
      // выловить по селектору <span id="timer">
      // и начать отнимать время через setInterval
    <script>

<?}

[Артем Гартунг]

hzzzzl, можно привести пример?)