jquery在select中获取所选选项的标记

时间:2014-04-13 17:45:04

标签: jquery select tags option

我搜索了很多简单的东西,但我找不到解决办法。 如何在jquery中获得所选选项的价格?...假设

<select id="combo">
    <option value="1" price="22">Soap</option>
    <option value="2" price="24">Milk</option>
</select>

我知道如何获得价值和名称......但是价格?

提前致谢..

谢谢..解决了......如果有人需要它...如何计算选择中的价格折扣...带小数。

HTML

<div class="row">
    <div class="col-md-4 form-group">
        <label>Variedad</label>
        <div class="controls">
            <select class="form-control cambio" id="variedad" name="variedad_id">
                <option value="4" data-precio="40.00">Plata</option>
                <option value="1" data-precio="10.00">Oro</option>
                <option value="3" data-precio="30.00">Cobre</option>
                <option value="2" data-precio="20.00">Platino</option>
            </select>
        </div>
    </div>
    <div class="col-md-2 form-group">
        <label>Precio Gramo</label>
        <div class="controls">
            <span class="form-control" id="precio">20.00</span>
        </div>
    </div>

    <div class="col-md-2 form-group">
        <label>Peso</label>
        <div class="controls">
            <input class="form-control cambio" name="peso" type="number" id="peso">
        </div>
    </div>
    <div class="col-md-2 form-group">
        <label>Descuento</label>
        <div class="controls">
            <span class="form-control" id="descuento">0</span>
        </div>
    </div>
    <div class="col-md-2 form-group">
        <label>Total</label>
        <div class="controls">
            <span class="form-control" id="total">10.00 €</span>
        </div>
    </div>
</div>

JQUERY

$(document).ready(function () {
   $('select#variedad').on('change', function () {
        var precio = $('option', '#variedad').filter(':selected').data('precio');
        $('span#precio').html( precio );
    });

    $('.cambio').bind( "change keyup", function() {
        var precio = document.getElementById('precio').innerHTML;
        precio = parseFloat(precio);

        var descuento = document.getElementById('descuento').innerHTML;
        descuento = parseFloat(descuento);

        var peso = parseFloat($('input#peso').val());

        var total = (precio*peso) - ( ( ( precio * peso ) * descuento ) / 100 )
        total = (total).toFixed(2);
        $('span#total').html(total + ' €');

    });

2 个答案:

答案 0 :(得分:0)

$('option', '#combo').filter(':selected').attr('price');

但是,您可能希望使用data-price作为属性

$('option', '#combo').filter(':selected').data('price');

答案 1 :(得分:0)

$("#combo option:selected" ).attr("price");

它会退回价格。

例如:如果您在组合框中选择肥皂,则会将价格重新调整为&#34; 22&#34;。