0

フォームにテキストボックス配列があり、価格と％を入力したときのパーセンテージに従ってコスト価格を計算する必要があります。cpはmouseupイベントで計算されます。

sp1(name = price[] class = price)  %(class = perc)  cp1(name = cost[] class = cost)
sp2(name = price[] class = price)  %(class = perc)  cp2(name = cost[] class = cost)
sp3(name = price[] class = price)  %(class = perc)  cp3(name = cost[] class = cost)
sp4(name = price[] class = price)  %(class = perc)  cp4(name = cost[] class = cost)
sp5(name = price[] class = price)  %(class = perc)  cp5(name = cost[] class = cost)

これが私のjqueryコードです

$(function(){
var price = document.getElementsByClassName('price')[0];
var taxAmount = document.getElementsByClassName('cost')[0];
var tax = document.getElementsByClassName('perc')[0];

tax.onblur = function() {
    var taxAmount1= parseFloat(price.value) * parseFloat(tax.value) / 100;
    var tt = parseInt(price.value)-parseInt(taxAmount1);
   taxAmount.value=tt;
}   
});

しかし、これは最初のテキストボックスについてのみ計算します。テキストボックス配列全体に対してどのように計算できますか。このフォームをphpで送信したいので、配列を使用しています。

助けていただければ幸いです。

4

1 に答える 1

0

jQueryセレクターは、一致する要素の配列に対して完全に機能するため、次のように書くと、

$('.perc').blur( function() {
    ...
} );

このイベントは、クラス「perc」のすべての要素に対して処理されます。計算を続行するには、クラス「価格」と「コスト」で残りのフィールドにアクセスし、値を取得$theElement.val()して計算を行う必要があります。

2 つの最も簡単な方法は次のとおりです。

  1. イベントを発生させた要素 $(this) から始めて、DOM ツリーをナビゲートし、残りのフィールドを検索します。たとえば、price、taxAmount、および tax の入力フィールドが兄弟である場合、対応するjQuery メソッドを使用できます( $(this).siblings('.cost').val();)。親、子などにアクセスする方法は他にもあります。
  2. のように、関連する 3 つの入力フィールドのインデックスを HTML5 データ属性に保存します<input ... class="price" data-index="0" />。そうすれば、他のフィールドを簡単に選択できますvar index = $(this).data('index'); var price = $('input[data-index="' + index + '"].price').val();

これらのヒントで続行できるはずです。詳細については、関連する HTML 構造を提供してください。

于 2012-08-11T01:31:07.247 に答える