0

我在表单上有 25 行供用户输入项目代码（输入标签）和数量（输入标签）针对 java 脚本中的项目代码计算该项目数量的值并以数量显示它们（输入标签）触发
事件在 onKeypress/up/down如下

function qtycal() {

    for (i = 1; i <= 25; i++) {

        var quantity_j = document.getElementById("quantity_" + i);
        var price_j = document.getElementById("price_" + i);
        var amount_j = document.getElementById("amount_" + i);

        amount_j.value = price_j.value * quantity_j.value;


    } // end of for

就像在按键/向下/向上触发

问题是当我输入第一个数字时，它不计算值并显示数量，并且在输入第二个数字后再次触发事件，但不是将 quantity_j 的整个值与 price_j 相乘

如何制作事件，以便给出准确的金额。

html代码

    <table border="1"  align="center">
<thead>
<tr>
<th>#</th>
<th>Item Name</th>
<th>Item Code</th>
<!--<th>Stock</th>-->
<th>Quantity</th>
<th>Price</th>
<!--<th>Discount %</th>
<th>Amount</th>-->
<!--<th>Discount Amount</th>-->
<th>Net Amount</th>
</tr>
</thead>

<tbody>
<?php for($i=1 ; $i<=25 ; $i++) { ?>

<tr>
<th> <?php echo "$i"; ?> </th>
<td><input id="itemName_<?php echo $i; ?>"  onBlur="test()" class="orderInput" type="text" align="center"  ></td>
<td><input id="itemCode_<?php echo $i; ?>"   onBlur="loaditem()"  class="orderInput" type="text" align="center" ></td>
<td><input id="quantity_<?php echo $i; ?>"    onBlur="qtycal()" class="orderInput"  type="text" align="center" ></td>
<td><input id="price_<?php echo $i; ?>" class="orderInput" type="text" align="center"  readonly></td>
<td><input id="amount_<?php echo $i; ?>" class="orderInput" type="text" align="center" readonly ></td>
</tr>

<?php } ?>
</tbody>

<tfoot>
<tr>
<td id="tdTotal" colspan="2" style="font-size:16px"> <b>Totals</b></td>
<td id="totalspace" colspan="3"> </td>
<td><input id="netTotalAll" class="orderInput" type="text" readonly> </td>
</tr>

<button id="addBtn"  ><img src="images/add.png" align="middle"></button>

</tfoot>
</table>
4

3 回答 3

0

看起来你计算得很好，但 amount_j 不是对 DOM 值的引用，所以试试这个：

var quantity_j = document.getElementById("quantity_" + i).value;
var price_j = document.getElementById("price_" + i).value;
var amount_j = document.getElementById("amount_" + i).value;

amount_j = price_j * quantity_j;

document.getElementById("amount_" + i).value=amount_j;
于 2013-06-26T13:18:55.280 回答
0 
// @see http://jsfiddle.net/scafa/GFsPY/

$(document).ready(function(){
  // creating some sample data rows
  var tb = $("<tbody>");
  for(var i=1;i<=10;i++){
    var row = $("<tr>");
    row.append($("<td>").html(i));
    row.append($("<td>").html("A"+i));
     row.append($("<td>").html($("<input>").attr("size",8).val(Math.round(Math.random()*10))));    
     row.append($("<td>").html($("<input>").attr("size",8).val(Math.round(Math.random()*100))));    
     row.append($("<td>").append($("<input>")));
     tb.append(row);   
  }
  $("table").append(tb);

  // calculating
  $("table input").bind("blur", function(){
    var total = 0;
    $.each($("table tbody tr"), function(i, r){
      var fields = $(r).find("input");
      $(fields[2]).val($(fields[0]).val() * $(fields[1]).val());
      total += parseInt($(fields[2]).val());
    });
    $(".total").val(total);
  });

});

虽然没有 PHP 环境，但我只是写了一个小提琴。也许这会给你一个提示如何解决你的问题。不要怪我，我只是在几分钟内破解了它。但它有效。这只是一个例子！

于 2013-06-27T18:26:51.900 回答
0

AFAIK 你必须将你的函数绑定到 keyup 以获得实际值。

如果这不起作用，您可以使用 setTimeout("qtycal", 100) 对您的函数进行一些延迟。您的用户不会注意到它，并使您的计算有效。

于 2013-06-26T12:58:39.780 回答