35

「現在の合計」に対していくつかの計算を行おうとしています。これが私のコードです。

$('.quantity_input').live('change',function(){         
                var ValOne = parseFloat($(this).val());
                var ValTwo = parseFloat($(".price").text())
                var totalTotal = ((ValOne) * (ValTwo));                         
                $('.cost_of_items').closest('.cost_of_items').text(totalTotal.toFixed(2));
                calcTotal();
            });     

.quantity_inputは入力、.priceは商品の価格、.cost_of_itemsはアイテムの合計コストを更新する場所です。item1=£5x3数量=item1の合計£15calcTotal()は、注文の合計コストを更新するだけの関数です。問題は、すべての計算をテーブルの1つの行に保持することです。つまり、上記のコードで計算を実行していて、その行に固執せず、クラス.cost_of_itemsなどですべてのフィールドを更新しています。

私のhtmlを表示する際の問題は、jQuery .appends()によって動的に追加されることですが、関連するjQueryは次のとおりです。

$('#items').append('<tr class="tableRow"><td><a class="removeItem" href="#"><img src="/admin/images/delete.png"></img></a><td class="om_part_no">' + omPartNo + '</td><td>' + supPartNo + '</td><td>' + cat + '</td><td class="description">' + desc + '</td><td>' + manuf + '</td><td>' + list + '</td><td>' + disc + '</td><td><p class="add_edit">Add/Edit</p><input type="text" class="quantity_input" name="quantity_input" /></td><td class="price_each_nett price">' + priceEach + '</td><td class="cost_of_items"></td><td><p class="add_edit">Add/Edit</p><input type="text" class="project_ref_input" name="project_ref_input" /><p class="project_ref"></p></td></tr>');

編集:

実用的な解決策:

$('.quantity_input').live('change',function(){         
                var ValOne = parseFloat($(this).val());
                var ValTwo = parseFloat($(this).closest('tr').find('.price').text())
                var totalTotal = ((ValOne) * (ValTwo));                         
                $(this).closest('tr').find('.cost_of_items').text(totalTotal.toFixed(2));
                calcTotal();
            });     
4

4 に答える 4

64

あなたは含まれている.cost_of_items中を見つける必要があります:<tr>this

$(this).closest('tr').find('.cost_of_items')
于 2010-11-04T13:11:46.983 に答える
8

最も近いものは最も近い祖先(親、祖父母)を検索しますが、更新する正しい要素を見つけるために検索を実行する必要があります。たとえば、テーブル行に要素があり、同じ行に別の要素が必要な場合は、次のようになります。

$('.myElement').closest('tr').find('.someOtherElement');

編集:

あなたの場合、あなたは

$(this).closest('tr').find('.cost_of_items').text(totalTotal.toFixed(2));
于 2010-11-04T13:11:08.433 に答える
3

私は使用しません.find()jQueryのメソッドを使用して、最も近いところまでトラバースし、クラス<td>で兄弟を取得する方がおそらく少し効率的だと思います。<td>.cost_of_items.siblings()

$(this).closest('td').siblings('.cost_of_items');

編集:明確にするために、ここに:からのマークアップがあり.append()ます

<tr class="tableRow">
     <!-- NOTE THAT THE CLOSING </td> IS MISSING FOR THE FIRST <td> -->
    <td><a class="removeItem" href="#"><img src="/admin/images/delete.png"></img></a>
    <td class="om_part_no">' + omPartNo + '</td>
    <td>' + supPartNo + '</td>
    <td>' + cat + '</td>
    <td class="description">' + desc + '</td>
    <td>' + manuf + '</td>
    <td>' + list + '</td>
    <td>' + disc + '</td>
     <!-- TRAVERSE TO HERE -->
    <td>
       <p class="add_edit">Add/Edit</p>
        <!-- START HERE -->
       <input type="text" class="quantity_input" name="quantity_input" />
    </td>
    <td class="price_each_nett price">' + priceEach + '</td>
     <!-- SIBLING IS HERE -->
    <td class="cost_of_items"></td>
    <td><p class="add_edit">Add/Edit</p><input type="text" class="project_ref_input" name="project_ref_input" /><p class="project_ref"></p></td>
</tr>
于 2010-11-04T13:41:50.477 に答える
-2

findを使用する必要はありません。closestコンテキスト引数を取ります。これは、検索の分野を絞り込むのに役立ちます。あなたはそれを使うべきです。

于 2010-11-04T13:16:29.683 に答える