Javascript函数不会在我调用的每个模态上运行

Question

我有一个数据，我在页面中使用while循环显示。当我点击蓝色按钮“beli”时，模态将显示。像这样：

我使用javascript函数自动计算图像2x12000 = 24.000，并在文本框上显示结果（24.000），标签为“total real”。它在第一个数据上运行良好。但是当我在下一个数据上进行模态显示时，javascript函数不会像我之前说过的那样自动计数。

这是javascript函数：

--database

并在while循环中调用它：

<script>
   function myFunction(val) {
    var a = document.getElementById("txt").value  * val;
    document.getElementById("txtreal").value = a;
   }
</script>
<script>
   function myFunctio(val) {
    var a =  document.getElementById("txtjumlah").value * val;
    document.getElementById("txtp").value = a;
   }
</script>  

像这样：

while(){



   // the modal here, and i call the function above.

}

Answer 1

<script>
   function myFunction(id, val) {
    var a = document.getElementById("txt"+id).value  * val;
    document.getElementById("txtreal"+id).value = a;
   }
</script>
<script>
   function myFunctio(id, val) {
    var a =  document.getElementById("txtjumlah"+id).value * val;
    document.getElementById("txtp"+id).value = a;
   }
</script>  

...
<td><input type="text" value="" name="txtjumlah<?php echo $i;?>" id="txtjumlah<?php echo $i;?>" class="input-xsmall" onKeyUp="myFunction(<?php echo $i;?>, this.value)"></td>
...
<td><input type="text" value="" name="txtpe<?php echo $i;?>" id="txtpe<?php echo $i;?>" class="form-control" onKeyUp="myFunctio(<?php echo $i;?>,this.value)"></td>
...

id在页面

上应该是唯一的