Member 13200081 Ответов: 1

Как создать часы обратного отсчета с помощью javascript?


У меня есть таблица со списком из 5 человек прямо из моей базы данных. Таблица была воспроизведена с помощью php с использованием метода(MySQLiselectData). Я хотел бы также установить дату, которую я отсчитываю, как дату окончания учебы. Как мне взять эту дату окончания из каждой строки таблицы и поместить ее в свой javascript, чтобы создать свой обратный отсчет?

Что я уже пробовал:

<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "graduation";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT id, name, date, status FROM student";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    echo "<table><tr><th>ID</th><th>Name</th><th>Date of Graduation</th><th>Count-Down-Clock</th></tr>";
    // output data of each row
    while($row = $result->fetch_assoc()) {
        echo "<tr><td>".$row["id"]."</td><td>".$row["name"]."</td><td>".$row["date"]."</td><th><p class='demo'></p></th></tr>";
    }
    echo "</table>";
} else {
    echo "0 results";
}
$conn->close();
?>


Вышесказанное является моим mysqli как извлечь код

<script>



// Set the date we're counting down to
var countDownDate = new Date("Sep 5, 2018 15:37:25").getTime();

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

    // Get todays date and time
    var now = new Date().getTime();
    
    // Find the dif between now an the count down date
    var dif = countDownDate - now;
    
    // Time calculations for days, hours, minutes and seconds
    var d = Math.floor(dif / (1000 * 60 * 60 * 24));
    var h = Math.floor((dif % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var m = Math.floor((dif % (1000 * 60 * 60)) / (1000 * 60));
    var s = Math.floor((dif % (1000 * 60)) / 1000);
    
    var formatted = d + "d " + h + "h " + m + "m " + s + "s ";
	// Output the result in an element with id="demo"
    [...document.querySelectorAll(".demo")].forEach(el => el.innerHTML = dif < 0 ? "Expired" : formatted);
	

	
    
    // If the count down is over, write some text 
    if (dif < 0) {
        clearInterval(x);
        
    }
}, 1000);
</script>


Выше приведен мой код javascript, который отправляет часы обратного отсчета на



Мой вопрос заключается в том, как я могу взять эту дату окончания из каждой строки таблицы и поместить ее в свой javascript, чтобы создать свой обратный отсчет?

Nakhia_ind

сэр ниже код может работать
var date1 = новая дата('7/11/2010');
var date2 = новая дата('12/12/2010');
ВАР diffDays = дата2.функции getdate() - дата1.функции getdate();
тревога(diffDays)

1 Ответов

Рейтинг:
1

ZurdoDev

Вам нужно будет получить разницу во времени между тем и сейчас, а затем использовать функцию setTimeout (), чтобы продолжать показывать обратный отсчет.