我應該怎么做才能在表中的每個ID中循環我的JavaScript代碼

Question

我有一張桌子，將顯示保留的客戶，並將在剩余的日期/時間倒計時。 我如何使我的javascript循環獲取每個ID的到達日期和到達時間？

這是我的基本論點，我正在嘗試學習Ajax將其循環到我的php中，但是我想知道是否還有另一種循環它的方法。

<div class="card mb-3">
    <div class="card-header">
        <i class="fas fa-table"></i>Data Table Example</div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Promo ID</th>
                            <th>Firstname</th>
                            <th>Lastname</th>
                            <th>Contact number</th>
                            <th>Gender</th>
                            <th>Arrival Date</th>
                            <th>Arrival Time</th>
                            <th>Masahista</th>
                            <th>Status</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tfoot>

                    </tfoot>
                    <tbody>
                    <?php 
                    include'dbcon.php';
                    $user_query=mysql_query("select * from reservation")or 
                    die(mysql_error());
                    while($row=mysql_fetch_array($user_query)){
                    $id=$row['reserve_id']; ?>
                        <tr class="del<?php echo $id ?>">
                            <td>
                                <?php echo $row['reserve_id']; ?>
                            </td>
                            <td>
                                <?php echo $row['promo_code']; ?>
                            </td>
                            <td>
                                <?php echo $row['name']; ?>
                            </td>
                            <td>
                                <?php echo $row['lastname']; ?>
                            </td>
                            <td>
                                <?php echo $row['contact_number']; ?> 
                            </td>
                            <td>
                                <?php echo $row['gender']; ?>
                            </td>
                            <td>
                                <?php echo $row['arrival_date']; ?>
                            </td>
                            <td>
                                <?php echo $row['arrival_time']; ?>
                            </td>
                            <td>
                                <?php echo $row['masahista']; ?>
                            </td>
                            <td>
                                <p id='<?php echo $row[' reserve_id '];?>'></p>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

<script>
    // Set the date we're counting down to
    var countDownDate = new Date("<?php echo $row['arrival_date']; ?> <?php 
    echo $row['arrival_time']; ? > ").getTime();
    // Update the count down every 1 second
    var x = setInterval(function() {
    // Get todays date and time
    var now = new Date().getTime();
    // Find the distance between now and the count down date
    var distance = countDownDate - now;
    // Time calculations for days, hours, minutes and seconds
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 *
    60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    // Output the result in an element with id="demo"
    document.getElementById("<?php echo $row['reserve_id']; ?>").innerHTML =
    days + "d " + hours + "h " +
    minutes + "m " + seconds + "s ";
    // If the count down is over, write some text 
    if (distance < 0) {
    clearInterval(x);
    document.getElementById("<?php echo $row['reserve_id']; ?>").innerHTML =
    "EXPIRED";
    }
    }, 1000);
</script>

我希望腳本循環到每個id以獲得每個id的值

Answer 1

在php中回顯數據的同時，使用info-1，info-2，info-3等循環為每個標簽創建不同的ID，並使用javascript或jquery使用循環以相同的方式獲取每個標簽的文本，以獲取所有回顯IDS。