Как получить значение data в теге select option?

229

06 апреля 2019, 13:40

При помощи jquery необходимо взять значение data из выбранного option. Пытался сделать при помощи selected, но он берет самый первый option на котором саморучно написан атрибут selected...

<select id="product-select" required>
    <option value="Выбранный пакет услуг" disabled selected>Выбранный пакет услуг</option>
    <option data-price="14 800" value="Minimum">Minimum</option>
    <option data-price="21 800" value="Basic">Basic</option>
    <option data-price="32 800" value="Premium">Premium</option>
</select>
$('#product-select').on('change', function () {
    $val = $('#product-select option:selected').data(price);
    $('.buy-popup__price').attr('value', $val + ' рублей');
});

Answer 1

$('#product-select').on('change', function () { 
    $val = $('#product-select option:selected').data("price"); 
    $('.buy-popup__price').attr('value', $val + ' рублей'); 
}); 
$('#product-select').change(); 
$('#product-select').focus();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<select id="product-select" required> 
    <option value="Выбранный пакет услуг" disabled>Выбранный пакет услуг</option> 
    <option data-price="14 800" value="Minimum">Minimum</option> 
    <option data-price="21 800" value="Basic">Basic</option> 
    <option selected data-price="32 800" value="Premium">Premium</option> 
</select> 
<input type="text" class="buy-popup__price" />