0

各行の各フィールドの値を自動計算できるテーブルを作成したいと思います。これらのjquery計算機を見つけました。jstlforEachを使用する場合にどのように使用するのか、どのように使用すればよいので、各行のフィールドにユーザーが入力したものを自動計算できるのでしょうか。 。 ありがとう..

<html>
    <head>
       <script type="text/javascript"  src="js/jquery-latest.js"></script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
                          $(document).ready(function()
                        {
                            $('input').change(function()
                            {
                                var ProductUnitVal = parseInt($('#product-unit-val').val());
                                var TotalUnitSales = parseInt($('#total-unit-sales').val());

                                var answer = ProductUnitVal * TotalUnitSales;

                                $('#sales-val').html('$' + answer);
                            });
                        });
           </script>
    </head>
    <body>       

        Unit Value <input type="text" id="product-unit-val" /><br />
        Unit Sales <input type="text" id="total-unit-sales" /><br />
        <span id="sales-val"></span>

    </body>
</html>
4

1 に答える 1

1

行ベースにします。入力が変更されたら、要素のスコープを見つける最も近い行（tr）を探します。次に、そのスコープ（つまり行）だけでさまざまな要素を検索します。注：3つのアイテムのIDからクラスに変更しました。

<table id="thetable">
<tr>
<td>
Unit Value <input type="text" class="product-unit-val" />
</td>
<td>
Unit Sales <input type="text" class="total-unit-sales" />
</td>
<td><span class="sales-val"></span></td>
</tr>
</table>

そして、あなたのスクリプト：

                    $(document).ready(function()
                    {
                        $('#thetable input').change(function()
                        {
                            var $row = $(this).closest('tr');

                            var ProductUnitVal = parseInt($row.find('.product-unit-val').val());
                            var TotalUnitSales = parseInt($row.find('.total-unit-sales').val());

                            var answer = ProductUnitVal * TotalUnitSales;

                            $row.find('.sales-val').html('$' + answer);
                        });
                    });
于 2013-01-17T21:28:22.400 に答える