使用增量ID从循环调用Javascript

Call Javascript from recurring loop with incremental IDs

本文关键字：循环 调用 Javascript ID      更新时间：2023-09-26

我有这个php站点，并使用javascript。其中一个页面是一个有10行数据的输入表单。在这种情况下，有一行代码是这样编码的：

echo "<td style='border-width: 0'><input type='text' id = 'price1' style = 'font-size: 10px' name='poline1[price]' size='7'></td>";

在这个输入字段旁边有一个按钮：

echo "<td style='border-width: 0'><a href = 'javascript:void(0)' onClick = 'copyRow1;' class='button6'>Copy Down</a></td>";

Javascript函数copyRow1如下所示：

<script type="text/javascript">
function copyRow1() {
        document.fabricorder.price2.value = document.fabricorder.price1.value;
    }
</script>

它将输入框ID=price1中的输入值复制到输入框ID＝price2中。

我有10个类似这样的Javascript函数copyRow1（）、copyRow2（）、copyRow3（）等…

它工作得很好，但我正在努力优化所有代码，使其更容易修改，现在我想循环我的所有行。

所以我想以这种方式更改我的行脚本：

for ($i = 1; $i <= 10; ++$i){
echo "<tr>";
echo "<td style='border-width: 0'><input type='text' id = 'price$i' style = 'font-size: 10px' name='poline[$i][price]' size='7'></td>";
echo "<td style='border-width: 0'><a href = 'javascript:void(0)' onClick = 'copyRow($i);' class='button6'>Copy Down</a></td>";
echo "</tr>";
}

我的功能是这样的：

<script type="text/javascript">
function copyRow(i) {
        document.fabricorder.price(i+1).value = document.fabricorder.price(i).value;
    }
</script>

不幸的是，这不起作用。我做错了什么？

尝试将copyRow函数修改为：

 function copyRow(i) {
      for (var j=i,numRows=document.fabricorder.length;j<numRows;j++) {
           document.fabricorder["price"+(j+1)].value = document.fabricorder["price"+(j+1)].value;
      }
 }

您需要在所有输入字段上循环，将每个值复制到下一个。如果没有看到100%的代码，很难给你100%的工作代码。你能把它放在JSFiddle里吗？

相关文章：