1

我正在使用一系列选择菜单使用 jQuery 构建实时报价表单。我想出了下面的代码，它从每个选择菜单中获取默认值并将它们添加在一起：

$(document).ready(function(){
 $('select > option:selected').each(function() {
  var value = $(this).attr('label');

  total = parseFloat(total) + parseFloat(value);
  total = total.toFixed(2);
 });
 printTotal(total); // prints the total price
});

唯一的问题是这仅在页面加载时有效。我希望每次在任何选择菜单中选择新值时都会更新价格（有 6 个）。

我尝试使用触发器添加$("select").change(function () { ... } （如此处的示例代码所示），但这会将每个选择菜单的所有值相加（即总计是应有的 6 倍）。

我已经搜索了文档，但无法确定要使用哪个事件。任何人都可以帮忙吗？

如果有帮助，HTML 示例：

<select id="colors">
 <option label="25.00" value="XYZ">1 color</option>
 <option label="50.50" value="ABC">2 colors</option>
 <option label="75.75" value="MNO">3 colors</option>
</select>
4

2 回答 2

1

马特，我认为你在我的脑海中触发了一些事情，因为我想通了——至少，到目前为止它有效。

这是执行此操作的代码：

$(document).ready(function(){
    $('select').change(function() {
        var total = 0;
        $('select > option:selected').each(function() {
            var value = $(this).attr('label');

            total = parseFloat(total) + parseFloat(value);
            total = total.toFixed(2);
        });
        printTotal(total);
    });
});

它归结为var total = 0块的放置，每次进行新选择时都必须重置它。

于 2009-10-15T02:26:02.450 回答
0

在change调用中进行测试时，您需要确保在您单击option的元素的上下文中搜索 s 。select

$('select').change(function() {
    var total = 0;

    // note the second parameter passed to the $() function below
    $('option:selected', $(this)).each(function() {
        var value = $(this).attr('label');
        total += parseFloat(value).toFixed(2);
    });
    printTotal(total);
});
于 2009-10-14T06:57:22.543 回答