仅显示 while 循环中 JavaScript 的最后一个值答案

【问题标题】：Only last value from JavaScript in while loop is displayed仅显示 while 循环中 JavaScript 的最后一个值
【发布时间】：2019-09-22 16:07:43
【问题描述】：

我正在处理从数据库接收到的 while 循环数据中显示的代码。在该代码中有一个表单，我在其中添加了一个隐藏输入 (name="position")。我想使用该输入来存储窗口顶部的像素数。不幸的是，我添加的 javascript 仅在循环的最后一个表中更改隐藏输入的值。在第一个表中，名为“位置”的隐藏输入保持不变（保持为空）。谁能帮帮我？

<?php
while ($row = $wynik->fetch_assoc()) {
?>          

<form method="post" style="margin-bottom: 0px;" onsubmit="poz()">
<input type="hidden" name="edition" value="<?php echo $row["id"]; ?>">
<input type="hidden" id="<?php echo $row["id"]; ?>" name="position" value="">
<input type="submit" value="Edytuj" class="edytuj">
</form>

<script>
function poz() {
var position = window.pageYOffset;
document.getElementById(<?php echo $row["id"]; ?>).value = position;
}
</script>

【问题讨论】：

生成页面后，查看pos()函数的页面源，可能有好几个。
可能首先确保您的getElementById 中有引号。你记得把它们放在其他任何地方，但它们仍然在那里丢失。此外，正如刚才所指出的，要么为每一行构建单独的函数，要么使用一个函数来查找它被调用的形式。

标签： javascript php

【解决方案1】：

你需要添加一个事件监听器才能知道点击了什么

window.addEventListener("load",function() {
  [...document.querySelectorAll(".edytuj")].forEach(function(elem) {
    elem.addEventListener("click",function (e) {
      var tgt = e.target;
      tgt.previousElementSibling.value=tgt.offsetTop;
    })
  });
})

<input type="hidden" name="edition" value="<?php echo $row["id"]; ?>">
<input type="hidden" id="<?php echo $row["id"]; ?>" name="position" value="">
<input type="button" value="Edytuj" class="edytuj">

【讨论】：