Запускать скрипт javascript, когда нажатие кнопки не работает
У меня есть следующий сценарий.
var time = document.getElementById("picker-dates").value;
time = time.split(':');
var date = new Date();
var countDownDate = date.setHours(time[0], time[1], time[2]);
function countdownTimeStart() {
var x = setInterval(function () {
// set hours, minutes and seconds, decrease seconds
var hours = time[0];
var minutes = time[1];
var seconds = time[2]--;
// if seconds are negative, set them to 59 and reduce minutes
if (time[2] == -1) {
time[1]--;
time[2] = 59
}
// if minutes are negative, set them to 59 and reduce hours
if (time[1] == -1) {
time[0]--;
time[1] = 59
}
// Output the result in an element with id = "demo"
// add leading zero for seconds if seconds lower than 10
if (seconds < 10) {
document.getElementById("demo").innerHTML = hours + ": " + minutes + ": " + "0" + seconds + " ";
} else {
document.getElementById("demo").innerHTML = hours + ": " + minutes + ": " + seconds + " ";
}
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "00:00:00";
}
}, 1000);}
countdownTimeStart();
Поэтому я хочу запускать этот скрипт при нажатии кнопки. Я пробовал это как
<button class = "start" onclick = "countdownTimeStart();">Start</button>
Но это не работает. Как я могу заставить это работать. Может ли кто-нибудь помочь мне решить эту проблему.
Переменное расстояние никогда не определяется, не могли бы вы в следующий раз предоставить работоспособный пример?
В чем проблема с переменной расстояния? Подскажите, пожалуйста
Переменное расстояние, которое используется в условии if, никогда не определяется и не объявляется для этого. Он просто появляется в условии if. Что делает переменная расстояния и откуда она в первую очередь получает свое значение, прежде чем мы начнем проверять ее значение?
Если бы вы могли просто поделиться HTML-кодом элемента выбора дат, я думаю, что код может начать работать.
@binDebug Это HTML-код элемента выбора дат "<input type = " text "id = " picker-dates "/>
Пожалуйста, помогите мне решить эту проблему. Я новичок в javascript
Ответ, размещенный ниже, с подробностями о том, как и почему сценарий был неправильным.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Этот код похож на тот, который вы запрашивали вчера, за исключением того факта, что он запрашивает ввод часов, минут и секунд. Ссылка здесь: Таймер обратного отсчета JavaScript для часа, минут и секунд при нажатии кнопки запуска
У вас было несколько частей кода, отсутствовавших со вчерашнего дня, особенно та часть, где вам нужно учесть текущую дату (переменная сейчас) и расстояние, которое таймер должен пройти (переменная расстояние), вычесть сейчас из введенных часов, минут и секунд.
Также ввод данных должен производиться после нажатия кнопки. Следовательно, переместил код, в котором вы считываете значение из поля даты средства выбора ввода, в обработчик нажатия кнопки.
С этой целью вот рабочий код
- HTML
<!DOCTYPE html>
<html>
<head>
<link rel = "stylesheet" href = "style.css">
<script src = "script.js"></script>
</head>
<body>
<div>Please enter the time in HH:MM:YY</div>
<input type = "text" id = "picker-dates" />
<p id = "demo"></p>
<button id = "start" class = "start" onclick = "countdownTimeStart()">Start</button>
</body>
</html>- Сценарий
function countdownTimeStart() {
var time = document.getElementById("picker-dates").value;
time = time.split(':');
var date = new Date();
var countDownDate = date.setHours(time[0], time[1], time[2]);
console.info(countDownDate);
var x = setInterval(function () {
// set hours, minutes and seconds, decrease seconds
var hours = time[0];
var minutes = time[1];
var seconds = time[2]--;
// if seconds are negative, set them to 59 and reduce minutes
if (time[2] == -1) {
time[1]--;
time[2] = 59
}
// if minutes are negative, set them to 59 and reduce hours
if (time[1] == -1) {
time[0]--;
time[1] = 59
}
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Output the result in an element with id = "demo"
// add leading zero for seconds if seconds lower than 10
if (seconds < 10) {
document.getElementById("demo").innerHTML = hours + ": " + minutes + ": " + "0" + seconds + " ";
} else {
document.getElementById("demo").innerHTML = hours + ": " + minutes + ": " + seconds + " ";
}
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "00:00:00";
}
}, 1000);
}Рабочий планшет здесь: https://plnkr.co/edit/65UL4Tj2gGwpeWBfHbgy?p=preview
Я очень ценю и благодарю вас за ваш ответ. Но все равно не работает. Я не мог его решить и застрял здесь.
Где именно ты застрял? Не могли бы вы поставить его на доску, чтобы мы могли посмотреть? Или, может быть, поделитесь своим кодом целиком?
Я хочу запустить этот скрипт при нажатии кнопки «Пуск». Но не работает
Не могли бы вы попробовать добавить скрипт и HTML-код, указанные выше, в файл HTML и js, сослаться на файл и запустить?
если вы удалите внутренности
countdownTimeStart()и просто поместите туда предупреждение (или console.info), будет ли эта функция вообще вызвана?