0

我将汇总来自不同类型表单元素的值。下拉并输入。该过程进展顺利，但我被困在我更改选项后总不会自动更新。

这是我的代码：

<form>
        <label>cost: <input type="text" name="cost_1" size="5" class="summable"/></label>
        <label>qty: <input type="text" name="cost_1_qty" size="2"/></label><br/>

        <label>cost: <input type="text" name="cost_2" size="5" class="summable"/></label>
        <label>qty:     <select name="cost_2_qty">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    </select></label><br/>

        <label>cost: <input type="text" name="cost_3" size="5" class="summable"/></label>
        <label>qty: <input type="text" name="cost_3_qty" size="2"/></label><br/>

        <strong id="summation"></strong><br/>
    </form>
    <script type="text/javascript">

        function doTotal() {
            var total = 0.0;

            $(".summable").each(function (idx, element) {
                $this = $(this);

                var cost = parseFloat($this.val());
                var qty_selector = '[name=' + $this.attr('name') + '_qty' + ']'; // eg: [name=cost_3_qty]
                var qty = parseFloat($(qty_selector).val());
                if (cost && qty)
                    total += cost * qty ;
            });

            $("#summation").html(total.toFixed(2));
        }

        $(document).ready(function() {
            $("input[type=text]").blur(function (e) {
                doTotal();
            })
        });         
    </script>

现场版：http: //jsfiddle.net/hWcMv/

我需要在选择选项后立即计算总值。请建议。

4

1 回答 1

2 
    $(document).ready(function() {
        $('[name*="cost"]').change(function () {
            doTotal();
        })
    });​

http://jsfiddle.net/hWcMv/2/

于 2012-11-23T15:59:36.793 回答