从选择中更新文本字段中的价格

时间:2015-04-04 13:29:39

标签: jquery

我有一个文本字段,我们在其中手动输入价格。

然后我有一个包含可以由用户选择的包的选择字段。根据所选内容,我希望将包的价格添加到文本字段中。

我的HTML是......

 <label for="_cost">Total Cost:</label><br />
        &pound;<input type="text" name="_cost" id="_cost" value="" placeholder="0.00" />

<label for="_package">Select an Event Package:</label><br />
                <select name="_package" id="_package">
                <option value="" data-price="0.00">No Package</option>

                <option value="test" data-price="100.00">Test</option>
                </select>

使用jQuery

执行此操作的最佳方法是什么?

2 个答案:

答案 0 :(得分:2)

这样的事情会起作用:

$(document).ready( function(){
    $("select").on("change", function(){            
        $("#_cost").val( $(this).find(":selected").data("price") );  
    });
});

答案 1 :(得分:0)

这样的事情似乎有用......

$(document).ready(function () {
                base = 0;
                $("#_cost").on("keyup", function () {
                    base = $('#_cost').val();
                });
                $("#_package").on("change", function(){            
                    var total = (base * 100 + $(this).find(":selected").data("price") * 100 ) / 100;  
                    $("#_cost").val(total.toFixed(2));
                });
            });