Невозможно запустить функцию JavaScript дважды на одной странице (внутри цикла WordPress) / функция JavaScript не будет запускаться более одного раза
Я некоторое время искал в Интернете, чтобы попытаться выяснить, где моя функция JavaScript не будет работать более одного раза на странице. Я посмотрел довольно много постов о том, что функции JavaScript не работают более одного раза, и главное, что я извлек из них, это то, что идентификаторы должны быть уникальными, как вы, вероятно, можете сказать из моего кода. Однако мне все еще не удалось заставить это работать.
По сути, я пытаюсь добавить таймеры обратного отсчета к сообщениям, отображаемым на странице, с помощью цикла wordpress. Код внизу вызывается во время цикла wordpress.
$ Pid является идентификатором поста, и это прекрасно работает для создания уникальных идентификаторов div.
Первоначально код работал бы над вторым из двух сообщений, отображаемых на странице, причем первый не вел обратный отсчет.
Тем не менее, способ, которым это в настоящее время закодировано, ни не работает, это потому что:
function setCountDown_<?php echo $pID; ?>()
Когда я добавил идентификатор в ^^^, а также:
setCountDown_<?php echo $pID; ?>()
Я сделал это, потому что думал, что это не работает из-за того, что эта функция, возможно, не уникальна и что где-то возникает проблема, но, очевидно, это не так.
Вне цикла у меня также есть это в теге body:
<body onload="setCountDown();">
Мне было интересно, может ли кто-нибудь помочь мне решить, что мне нужно сделать, чтобы этот код работал правильно, так как я чувствую, что что-то упустил.
В настоящее время код просто отсчитывает от 25 минут, пока все нормально, в конце концов, он будет с установленной даты.
Заранее спасибо за любую помощь и совет.
<div id="countdown-<?php echo $pID; ?>" class="featured">
<?php
$dateFormat = "d F Y -- g:i a";
$targetDate = time() + (25*60);//Change the 25 to however many minutes you want to countdown
$actualDate = time();
$secondsDiff = $targetDate - $actualDate;
$remainingDay = floor($secondsDiff/60/60/24);
$remainingHour = floor(($secondsDiff-($remainingDay*60*60*24))/60/60);
$remainingMinutes = floor(($secondsDiff-($remainingDay*60*60*24)-($remainingHour*60*60))/60);
$remainingSeconds = floor(($secondsDiff-($remainingDay*60*60*24)-($remainingHour*60*60))-($remainingMinutes*60));
$actualDateDisplay = date($dateFormat,$actualDate);
$targetDateDisplay = date($dateFormat,$targetDate);
?>
<script type="text/javascript">
var days = <?php echo $remainingDay; ?>
var hours = <?php echo $remainingHour; ?>
var minutes = <?php echo $remainingMinutes; ?>
var seconds = <?php echo $remainingSeconds; ?>
function setCountDown_<?php echo $pID; ?>()
{
seconds--;
if (seconds < 0)
{
minutes--;
seconds = 59
}
if (minutes < 0)
{
hours--;
minutes = 59
}
if (hours < 0)
{
days--;
hours = 23
}
document.getElementById("remain-<?php echo $pID; ?>").innerHTML = days+" days, "+hours+" hours, "+minutes+" minutes, "+seconds+" seconds";
SD<?php echo $pID; ?>=window.setTimeout( "setCountDown_<?php echo $pID; ?>()", 1000 );
if (minutes == '00' && seconds == '00')
{
seconds = "00";
window.clearTimeout(SD<?php echo $pID; ?>);
window.alert("Time is up. Press OK to continue."); // change timeout message as required
window.location = "http://www.readfree.ly/" // Add your redirect url
}
}
</script>
Start Time: <?php echo $actualDateDisplay; ?><br />
End Time:<?php echo $targetDateDisplay; ?><br />
<div id="remain-<?php echo $pID; ?>">
<?php echo "$remainingDay days, $remainingHour hours, $remainingMinutes minutes, $remainingSeconds seconds";?>
</div>
<?php
echo $pID;
?>
Решение
Мое первоначальное предположение, поскольку на самом деле неясно, что вы делаете, и из того, что вы сказали, на одной странице будет несколько сценариев, вы объявляете глобальные переменные для времени, а затем манипулируете ими в функции. пример
var a = 1;
function b(){
a = a--; /*And other magic math */
}
function c(){
a = a++; /*And other magic math */
}
b(); c();
/* What does a =? */
/* TRY */
function b(){
var a = <?php echo $var; ?>
a = /* Do stff with a */
}
function c(){
var a = <?php echo $var; ?>
a = /* Do stff with a */
}
У вас есть две функции, взаимодействующие с одними и теми же переменными с использованием тайм-аутов и вещей, которые я не хочу пытаться понять. Подумайте о том, как определить эти переменные времени. Я уверен, что это не поможет вашей проблеме. Таким образом, ваши временные переменные будут жить в рамках этих функций и не будут измотаны.
Также, чтобы проверить, что на самом деле работает, добавьте несколько console.logs, когда ваши функции запускаются.
Другие решения
Нужно поставить def функции JS перед ее использованием
Синтаксическая ошибка в PHP
var days = <?php echo $remainingDay; ?>
Вы должны добавить; в конце
var days = <?php echo $remainingDay; ?>;
Надеюсь, что это поможет, под MAMP после размещения JS-кода сверху и добавления «;» похоже на работу
С уважением
Питер