为什么使用 keyup 函数的 For 循环在 javascript 中不起作用？

Question

当我在文本框中输入金额时，它开始运行而不是循环工作。

我有一个 table 它显示多个动态行。

函数中的行数仅 count.value(javascript)

然后因为这个多行我只想循环添加价格 (rec_qty*porate)

HTML

<?php
$table=mysql_query("SELECT * from purchase_order");
while($table1=mysql_fetch_array($table))
{   
  $i++;

<tr>
<td><input type="hidden" id="tatalrecord" value="<?php echo $i;?>"></td>
<td><input type="text" style="width:45px" class="form-control rec_qty" onkeyup="myFunction()" id="rec_qty"></td>

<td><input type="text" style="width:45px" class="form-control porate" onkeyup="myFunction()" id="porate"></td>
</tr>
<?php } ?>
</table>

JAVASCRIPT

function myFunction() {
  var count = document.getElementById("tatalrecord");
  var cn = count.value;
  alert(count.value);
    for(var i = 0; i < cn; ++i)
    {
      alert("hi");
      var x = document.getElementById("rec_qty");
      var y = document.getElementById("porate");
      var z = x.value * y.value;
    } 
 }

Answer 1

嗨 Shruti 我试图解决你的问题我已经创建了自己的 table 假设 table 行

希望这段代码对您有所帮助....

<html>
<head>
    <script type="text/javascript">
        function myFunction() {

          // var count = document.getElementById("tatalrecord");

          //Total no of rows in your table
          var cn =  document.getElementById("tatalrecord").getElementsByTagName("tr").length;

          console.log(cn);

            for(var i = 0; i < cn; ++i)
            {
              console.log("hi");
              alert('hi');
              var x = document.getElementById("rec_qty");
              var y = document.getElementById("porate");
              var z = x.value * y.value;
              console.log(z);
            } 
         }
    </script>
</head>
<body>
    <form>
        <table id="tatalrecord">
        <tr><td>1</td></tr>
        <tr><td>2</td></tr>
        <tr><td>3</td></tr>
        <tr><td>4</td></tr>
        <tr><td>5</td></tr>
        </table>

        <input type="text" style="width:45px" class="form-control rec_qty" onkeyup="myFunction()" id="rec_qty">
        <input type="text" style="width:45px" class="form-control porate" onkeyup="myFunction()" id="porate">

    </form>
</body>
</html>

Answer 2

function myFunction() {
  var z = 0;
  var count = document.getElementById("tatalrecord");
            var cn = (count.value) ? parseInt(count.value) : 0;
            alert(count.value);
            for (var i = 0; i < cn; ++i)
            {
                var x = document.getElementById("rec_qty");
                var y = document.getElementById("porate");
                 z = parseInt(x.value) * parseInt(y.value);
            }
  
  
  document.getElementById("total").value = z
        }

<html>
<head>
<script> 
  
</script>
</head>
<body>
<table>
<tr>
    <input type="text" style="width:45px" value='2' id="tatalrecord">
<td><input type="text" style="width:45px" class="form-control rec_qty" onkeyup="myFunction()" id="rec_qty"></td>

<td><input type="text" style="width:45px" class="form-control porate" onkeyup="myFunction()" id="porate"></td>
</tr>
</table>
  
  total : <input type="text" style="width:45px" class="form-control porate" value="0" id="total">
</body>
</html>

Answer 3

<table>
<tr>
<td> Price </td>
<td> Quantity </td>
<td> Total  </td>
<tr>
<?php  
  $table = mysql_query("select * from table_name");
  $i=0;
  while($row = mysql_fetch_array($table))
  {
?>
  <tr>
  <td> <input type="hidden" id="tatalrecord" value="<?php echo $i; ?>"></td>
  <td> <input type="text" id="porate<?php echo $i; ?>" onkeyup="myFunction()" value="<?php echo $i; ?>"></td>
  <td> <input type="text" id="rec_qty<?php echo $i; ?>" onkeyup="myFunction()" value="<?php echo $i; ?>"></td>
  <td> <input type="text" readonly="" id="total"> </td>
  </tr>
}
</table>

Javascript

function myFunction() {
  var z = 0;
  var count = document.getElementById("tatalrecord");
  var cn = (count.value) ? parseInt(count.value) : 0;
  alert(cn);
  for (var i = 1; i <= cn; ++i)
  {
     var x = document.getElementById("rec_qty"+i);
     var y = document.getElementById("porate"+i);
     z = parseInt(x.value) * parseInt(y.value);
  }
}

为什么使用 keyup 函数的 For 循环在 javascript 中不起作用？

Why For loop not working in javascript using keyup function?

javascript

html

keyup