0

如何从以下 html 的多个下拉列表中获取值并编写 javascript。

<label for="select"></label>
<select name="select" id="select">
    <option value="1">p1-$10</option>
    <option value="2">p2-$20</option>
    <option value="3">p3-$30</option>
</select>
<select name="select2" id="select2">
    <option value="a">$10-a</option>
    <option value="b">$20-b</option>
    <option value="c">$30-c</option>
</select>

金额 - 75.00 美元 + 选择选项

我希望在下拉选择中更改金额 75.00 的值。请帮忙

4

2 回答 2

0

要获取值，您可以使用change()事件。我在您的选择中看到，您拥有的值是字母，我会考虑将它们更改为实际选择文本的数值，然后您可以这样做：

$("#select, #select2").change(function() {
    alert(this.value);
});

如果要添加它们，可以执行以下操作：

var total = 0;
$("#select, #select2").change(function() {
    total += parseInt(this.value);
    alert(total);
});
于 2013-06-07T12:57:24.487 回答
0

这是我的出价（示例）：

// here's the $75 you referenced
var basePrice = 75.00;

// our calculate function (so it can be called on page load and when they change
// their selection from the drop-downs.
function calculate(){
    // begin tallying price
    var price = basePrice;
    // go through each select list
    $('select').each(function(){
        // grab the selected option's text, then try to extact the
        // price from within (e.g. look for "$xx.xx")
        var sel = $(':selected',this).text(),
            itemprice = parseFloat(sel.match(/\$(\d+(?:\.\d{1.2})?)/)[1], 10);
        price += itemprice;
        // add it to running total
    });
    // now display the result back on the page.
    $('#price').text(price.toFixed(2));
}
// when the select changes, recalculate
$('select').change(calculate);
// also calculate when the page loads.
calculate();

附录：我建议不要尝试从商品文本中获取价格，而是使用任一value=""字段（如果可以，尽管它可能会引用该商品的数据库 id），否则，使用data-*attributes。这方面的一个例子是......

对您的项目进行一些更改（例如）

<option value="1" data-price="10.00">p1-$10</option>

然后对脚本进行更改：

//var sel = $(':selected',this).text(),
//        itemprice = parseFloat(sel.match(/\$(\d+(?:\.\d{1.2})?)/)[1], 10);
var itemprice = $(':selected',this).data('price');
于 2013-06-07T13:10:50.967 回答