1

クライアントが購入したアイテムの数とそれぞれのアイテムの合計金額に応じて動的に追加するテキストボックスの JavaScript コードがあります。金額は数量ごとに乗算されます。私ができないのは、それらをすべて追加することです。どうすれば達成できますか？while ループを使用しましたが、最後のアイテムの合計が返されました。ロジックは知っていますが、アイテムごとの合計金額を保存してから次のアイテムに追加する方法がわかりません。誰かが助けてくれることを願っています。ありがとう。

function totalBillItem(rowcount){
   var quantity = parseFloat($("#quantity"+rowcount).val());
   var payment_interval = parseFloat($("#payment_interval").val());
   var billing_price = parseFloat($("#billing_price"+rowcount).val());
   var product = (quantity * billing_price).toFixed(2);

   $("#total"+rowcount).val(product);

   while(rowcount != 0) {
      var sub_total = parseFloat($("#total"+rowcount).val());
      rowcount--; 
   }

   var grand_total = sub_total; 
      $("#grand_total").val(grand_total);
   }

私のHTML：

<table class="table table-striped table-hover" id="myTable">
<tr>
    <th style="text-align:center;background-color:#89CFF0;">Name</th>
    <th style="text-align:center;background-color:#89CFF0;">Product Price</th>
    <th style="text-align:center;background-color:#89CFF0;">Quantity</th>
    <th style="text-align:center;background-color:#89CFF0;">Billing Price</th>
    <th style="text-align:center;background-color:#89CFF0;">Total</th>
</tr>
<?php
    $row_count=0;
    $offset=0;
    foreach( $data as $row ) :

    $dta = unserialize($row->userdata);
?>
<tr class="info">
    <td style="text-align:center;" id="prod_name<? echo $row_count; ?>"><?php echo $dta['product_name']; ?></td>
    <td style="text-align:center;" id="product_amount<? echo $row_count; ?>"><?php echo $dta['product_amount']; ?></td>
    <td style="text-align:center;">
      <input type="text" name="quantity<? echo $row_count; ?>" id="quantity<? echo $row_count; ?>" class="span2" onkeydown="totalBillItem('<?php echo $row_count; ?>')" onkeyup="totalBillItem('<?php echo $row_count; ?>')" value="0">
    </td>
    <td style="text-align:center;">
      <input type="text" name="billing_price<? echo $row_count; ?>"  id="billing_price<? echo $row_count; ?>" class="span2" onkeydown="totalBillItem('<?php echo $row_count; ?>')" onkeyup="totalBillItem('<?php echo $row_count; ?>')" value="0">
    </td>
    <td style="text-align:center;">
      <input type="text" name="total<? echo $row_count; ?>" id="total<? echo $row_count; ?>" class="span2" readonly>
    </td>
</tr>

    <input type="hidden" name="prod_uuid<? echo $row_count; ?>" value="<? echo $dta['product_uuid']; ?>">
    <input type="hidden" name="prod_amount<? echo $row_count; ?>" value="<? echo $dta['product_amount']; ?>">
<?php
  $row_count++;
    endforeach;
?>
   <input type="hidden" name="row_ctr" value="<? echo $row_count; ?>">
</table>
<br />
Total:
<input type="text" name="grand_total" id="grand_total" class="span2" readonly>

どうすればこのようにできますか？http://jsfiddle.net/c4rjk/

4

1 に答える 1

0

何が起こっているのかわかりにくいですが、このコードには問題があります。

while(rowcount != 0){
    var sub_total = parseFloat($("#total"+rowcount).val());
    rowcount--; 
}

各ループで sub_total をリセットするだけで、while ループを終了すると実際には範囲外になります (Javascript で問題があるかどうかはわかりません)。

これを次のように変更します。

var sub_total = 0;
while(rowcount != 0){
    sub_total += parseFloat($("#total"+rowcount).val());
    rowcount--; 
}

編集：

合計を数える別の方法を次に示します。

クラス名を html の「total」行に追加します: (今のところ span2 を置き換えましたが、後で変更できます)

  <input type="text" class = "total" name="total<? echo $row_count; ?>" id="total<? echo $row_count; ?>" readonly>

while ループを次のように置き換えます。

var total_element = document.getElementsByClassName('total');
var sub_total = 0;
for (var i = 0; i < total_element.length; ++i) {
    var item = total_element[i];
    if (total_element[i].value) sub_total += parseFloat(total_element[i].value);
}

getElementsByClassName は IE8 以前ではサポートされていないことに注意してください:(

于 2013-09-19T07:48:51.553 に答える