JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="resultBox" readonly="true" />
<select id="dropdown_test" onchange="calc()">
    <option data-val1="0" data-val2="0" value="N">N</option>
    <option data-val1="1" data-val2="1" value="G">G</option>
    <option data-val1="0.3" data-val2="1" value="O">O</option>
    <option data-val1="0.5" data-val2="1" value="A">A</option>
    <option data-val1="0" data-val2="1" value="R">R</option>
    <option data-val1="0" data-val2="1" value="U">U</option>
</select>

JavaScript

function calc() {
    var select1_control = 10;
    var val1 = parseFloat(jQuery('#dropdown_test').find(':selected').data('val1'), 10);
    var val2 = parseFloat(jQuery('#dropdown_test').find(':selected').data('val2'), 10);
    jQuery('#resultBox').val((val1 * select1_control) + (val2 * select1_control));
}