为什么For循环无法使用keyup函数在javascript中工作？

Question

当我在文本框中输入金额时，它开始起作用，无法循环使用。

我有一张表，它显示了多个动态行。

行仅在函数中计数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

 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 2

<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);
  }
}

Answer 3

嗨，Shruti，我试图简化您的问题，我已经创建了自己的表格以承担表格行

希望这段代码对您有帮助。

<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>

为什么For循环无法使用keyup函数在javascript中工作？

问题描述

3 个解决方案

解决方案1
1 2016-10-04 06:06:08

解决方案2
1 已采纳

解决方案3
0 2016-10-04 05:57:50

为什么For循环无法使用keyup函数在javascript中工作？

问题描述

3 个解决方案

解决方案1 1 2016-10-04 06:06:08

解决方案2 1 已采纳

解决方案3 0 2016-10-04 05:57:50

解决方案1
1 2016-10-04 06:06:08

解决方案2
1 已采纳

解决方案3
0 2016-10-04 05:57:50