0

最後にチェックボックス列があるテーブルがあります。

HTML

<table border="1">
    <thead>
        <tr>
            <td>Name</td>
            <td>Amount</td>
            <td>Selected Rows</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Item 1</td>
            <td>5.0</td>
            <td><input type="checkbox" checked="checked"/></td>
        </tr>
        <tr>
            <td>Item 2</td>
            <td>3.0</td>
            <td><input type="checkbox" checked="checked"/></td>
        </tr>
        <tr>
            <td>Item 3</td>
            <td>4.0</td>
            <td><input type="checkbox" checked="checked"/></td>
        </tr>
    </tbody>
</table>
Total : $<input type="text" value="12.0" />

Jクエリ

$('input[type=checkbox]').change(function(){
   alert($(this).parent().parent().text());
});

チェックボックスを使用して選択した行に基づいて合計値を計算したい。このコード$(this).parent().parent().text();は、行全体のテキスト値を提供します。金額列の値だけを取得するには?

JSFIDDLE

4

1 に答える 1

2

行をループして、チェックされた値を合計する必要があります。これを試して：

$('input[type=checkbox]').change(function () {
    var total = 0;
    $('table tbody tr').each(function () {
        if ($('input:checked', this).length) {
            total += parseFloat($(this).find('td:eq(1)').text());
        }
    });
    $('#total').val(total.toFixed(1));
});

フィドルの例

DOM トラバーサルを改善して、いくつかのクラスまたは ID 属性を追加することでテーブル/入力に固有のものにすることができますが、合計を計算するためのパターンはどのような場合でも機能します。

于 2013-02-05T11:09:28.657 に答える