Php 如何使用foreach从html标记中获取动态值，并将其保存到momentObj的jquery变量中

老实说，我不知道如何为这篇文章制作一个合适的标题，但基本上我试图从带有

id=duration

标记的

span

中提取元素，该标记使用foreach动态地从数据库中获取，并使用它来显示带有countdown.js的持续时间的计时器，但我很困惑，因为它只提取了第一个foreach值，而没有提取其余的值，因为我认为它具有相同的id。 这就是观点

<table cellpadding="0" cellspacing="0" border="0">
                    <tbody>
                        <?php foreach($status as $row): ?>
                            <tr>
                                <td><?php   echo $row->room_name;                         
                                ?></td>
                                <td>                            
                                    <?php if($row->user_name!=null)
                                        {
                                            echo $row->user_name;
                                            
                                        }else{ echo "Available"; }; 
                                    ?>
                                </td>
                                <td>
                                    <?php if($row->start_time!=null)
                                        {
                                            echo $row->start_time;
                                        }else{  echo "Available";}; 
                                    ?>
                                </td>
                                <td><span class="timer"><span id="duration"><?php if($row->start_time!=null)
                                        {
                                            echo $row->start_time;
                                        }else{  echo "Available";}; 
                                    ?></span></span></td>
                                <td>
                                    <?php if($row->status!=null)
                                        {
                                            echo $row->status;
                                        }else{ echo "Available";}; 
                                    ?>
                                </td>
                            </tr>
                        <?php endforeach ?>
                    </tbody>
                </table>
<script src="assets/home/js/jquery.min.js"></script>
<script src="assets/js/moment.min.js"></script>
<script src="assets/js/countdown.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dynamic-marquee@1"></script>
<script>
var times = $('#duration').text();
    function update() {
        
        var addDay = /*$('#duration')*/ moment(times);
        $('#clock').html(moment().format('H:mm:ss')+ ' WIB');
        $('.timer').html(addDay.countdown().toString());
        console.log(addDay);
        console.log(times);
    }
    
    setInterval(update, 1000);

    $(window).on("load resize ", function() {
        var scrollWidth = $('.tbl-content').width() - $('.tbl-content table').width();
        $('.tbl-header').css({'padding-right':scrollWidth});
    }).resize();
</script>
<script>
    (function(){var countdown,moment,ref,ref1,slice=[].slice;countdown=(ref=typeof require==="function"?require("countdown"):void 0)!=null?ref:this.countdown;moment=(ref1=typeof require==="function"?require("moment"):void 0)!=null?ref1:this.moment;moment.fn.countdown=function(){var args,other;other=arguments[0],args=2<=arguments.length?slice.call(arguments,1):[];return countdown.apply(null,[this.toDate(),moment(other).toDate()].concat(slice.call(args)))}}).call(this);
    </script>

变量时间=$（“#持续时间”）.text（）；
函数更新（）{
var addDay=/*$（“#持续时间”）*/时刻（次数）；
$（'#clock'）.html（矩（）.format（'H:mm:ss'）+'WIB'）；
$（'.timer'）.html（addDay.countdown（）.toString（））；
控制台日志（addDay）；
console.log（次）；
}
设置间隔（更新，1000）；
$（窗口）。打开（“加载调整大小”，函数（）{
var scrollWidth=$（'.tbl content'）.width（）-$（'.tbl content table'）.width（）；
$（'.tbl header'）.css（{'padding-right'：scrollWidth}）；
}).resize（）；
（function（）{var countdown，moment，ref，ref1，slice=[].slice；countdown=（ref=typeof require==“function”？require（“countdown”）：void 0）！=null？ref:this.countdown；moment=（ref1=typeof require==“function”？require（“moment”）：void 0）！=null？ref1:this.moment；moment.fn.countdown=function（）{var args，other=args，other=args[0]，args=2因为ID必须是唯一的，所以只能使用公共类名。此外，您需要更改每个实例，在这种情况下，您可以使用
text（function）
，它将在内部循环到每个实例

然后，您还需要启动初始的
start\u time
，您可以使用
data-
属性来执行此操作。现在，无论何时调用
update（）
，您都可以从该属性获取初始值，并根据该值进行计算

我没有制造一些日期/时间，而是创建了一个非常简单的案例，在调用时只添加一个


函数更新（）{
console.log（'调用更新'）
$（'.timer'）.text（函数（）{
const start=$（this.data（'start'）；
//根据起始值进行计算
让newVal=start+1；
返回纽瓦尔
});
}
//为了简单起见只调用一次
设置超时（更新，2000）

房间
开始
1号房间
1.
2号房间
2.