javascript php 向多个单元格添加时间戳

javascript php adding timestamp to multiple cells

我是 php 和 javascript 的新手,所以请原谅我的无知。我正在尝试创建一个 javascript 以将时间戳插入多个单元格。我确实有一个按钮来插入或更新 mysql 数据库以输入时间戳 now(),但这不是我正在寻找的路线。如果有人有更好的主意,请告诉我。基本上我想点击一个按钮将时间插入 <td><center><input id="field" type="text" name="time[]" size="11"></center></td>.

<?php
include 'config.php';
?>
<html>
<head>
<script>

function getTimeStamp(id) {
 var now = new Date();
       return (now.getHours() + ':' + ((now.getMinutes() < 10) ? ("0" + now.getMinutes()) : (now.getMinutes())));
}

function setTime() {
    document.getElementById('field').value = getTimeStamp();

</script>
</head>
<body >
<div>

<button type="button" onclick="setTime();">TimeStamp</button>
<table >

 <tr >
  <td >id</td>
  <td >First Name</td>
  <td >Last Name</td>
  <td >Location</td>
  <td >Remarks</td>
  <td >Timestamp</td>
  
 </tr>

<?php
while ($row = mysqli_fetch_array($sql)){
 print '<tr>
  <td><input type="hidden" name="id[]" value="'. $row[0] .'">' .$row[0]. '</td>
  <td><input type="hidden" name="first[]" value="'. $row[1] .'">' .$row[1]. '</td>
  <td><input type="hidden" name="last[]" value="'. $row[2] .'">' .$row[2]. '</td>
  <td><input  name="location[]" value="'. $row[3] .'">' .$row[3]. '</td>
  <td><center><input type="text" name="remarks[]" size="43"></center></td>
  <td><center><input id="field" type="text" name="time[]" size="11"></center></td>
 </tr>';
}
?>
</table>
</div>
</body>
</html>

您首先需要添加一个 class 而不是 id 因为 id 是唯一的 & class 可以重复使用 <input id="field" type="text" name="time[]" size="11"> 将此更改为 <input id="field" class="timestamp-fields" type="text" name="time[]" size="11"> 然后

更改setTime功能

function setTime() {
  var elements = document.getElementsByClassName('timestamp-fields'), l = elements.length, t = getTimeStamp();
  for (var i = 0; i < l; i++) {
    elements[i].value = t;
  }
}

But you must remember you are using clients Date which is not UTC/GMT 0 so you might need to convert it to your server end using PHP.

如果我没理解错的话,您想通过单击按钮在所有输入字段中设置时间戳 time[]

我无法完全测试该函数,因为您的 getTimestamp 函数调用了此处未定义的其他函数,但它应该可以工作...

function setTime() {
    var col=document.querySelectorAll('input[type="text"][name="time[]"]');
    if(col){
        for( var n in col ) if(col[n].nodeType==1) col[n].value=getTimeStamp();
    }
}

根据您的评论

如果您希望根据点击字段为每个文本输入设置唯一的时间戳,那么函数和分配需要稍有不同。由于您不再需要带有附加 setTime 功能的按钮,您可以使用类似的东西并删除按钮并删除 setTime 功能...

function bindTimeEvents(){
    var col=document.querySelectorAll('input[type="text"][name="time[]"]');
    if( col ){
        for( var n in col )if( col[ n ].nodeType ==1 ){
            col[n].addEventListener('click',function(e){
                this.value=getTimeStamp();
            }.bind( col[n] ),false);
        }
    }
}
document.addEventListener('DOMContentLoaded',bindTimeEvents,false);