平變化的捕獲數據，價格從下拉

Question

大家好平變化我想從下拉菜單中選擇

<select class="tmcp-field hotel support-layer-thickness tm-epo-field tmcp-select tm-valid" name="tmcp_select_10" data-price="" data-rules="" data-original-rules="" id="tmcp_select_44" tabindex="44" aria-invalid="false"> 
    <option value="Select Thickness_0" class="tc-multiple-option tc-select-option" data-imagep="" data-price="" data-tm-tooltip-html="" >Select Thickness</option> 
    <option value="4_1" class="tc-multiple-option tc-select-option" data-imagep="" data-price="8000" data-tm-tooltip-html="" >4</option> 
    <option value="5_2" class="tc-multiple-option tc-select-option" data-imagep="" data-price="10000" data-tm-tooltip-html="" >5</option> 
    <option value="6_3" class="tc-multiple-option tc-select-option" data-imagep="" data-price="12000" data-tm-tooltip-html="" >6</option> 
</select> 

我怎樣才能獲得數據的價格值捕捉所選數據價格

謝謝

Answer 1

• 使用jQuery.data到get/set與指定的元件
• 使用相關聯的數據選擇讓selected選項

$('#tmcp_select_44').on('change', function() { 
 
    var option = $(this).find('option:selected'); 
 
    console.log(option.data('price')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<select class="tmcp-field hotel support-layer-thickness tm-epo-field tmcp-select tm-valid" name="tmcp_select_10" data-price="" data-rules="" data-original-rules="" id="tmcp_select_44" tabindex="44" aria-invalid="false"> 
 
    <option value="Select Thickness_0" class="tc-multiple-option tc-select-option" data-imagep="" data-price="" data-tm-tooltip-html="">Select Thickness</option> 
 
    <option value="4_1" class="tc-multiple-option tc-select-option" data-imagep="" data-price="8000" data-tm-tooltip-html="">4</option> 
 
    <option value="5_2" class="tc-multiple-option tc-select-option" data-imagep="" data-price="10000" data-tm-tooltip-html="">5</option> 
 
    <option value="6_3" class="tc-multiple-option tc-select-option" data-imagep="" data-price="12000" data-tm-tooltip-html="">6</option> 
 
</select>