Делаю блок калькулятора на чистом JS. Столкнулась с проблемой, что не могу получить значение value в option. Как вариант, получилось только через onchange в html, но знаю, что это костыль, поэтому интересует правильное решение.
var select = document.getElementById('agriculture');
selectFunction = function() {
var getValue = select.value;
console.log(getValue);
}
<select id="agriculture" onchange="selectFunction()">
<option value="3100">Пшеница ≈ 3100 грн / т"</option>
<option value="2500">Овес ≈ 2500 грн / т"</option>
<option value="3100">Рожь ≈ 3100 грн / т"</option>
<option value="2400">Кукуруза ≈ 2400 грн / т"</option>
<option value="1850">Просо ≈ 1850 грн / т"</option>
</select>
Потом эти значения буду использовать в формуле.
Это не костыль, просто иногда бывает неудобно редактировать JS-функции в HTML. К тому же, где-то в другом месте кода если захочется добавить еще одно событие onchange на этот элемент, новый будет работать, а предыдущий - перестанет. В целом, полезнее использовать addEventListener
var select = document.getElementById('agriculture');
select.addEventListener('change', function(){
var getValue = this.value;
// this в этом контексте - элемент, который запустил фукнцию. То же, что и select.value;
console.log( getValue );
});
<select id="agriculture">
<option value="3100">Пшеница ≈ 3100 грн / т"</option>
<option value="2500">Овес ≈ 2500 грн / т"</option>
<option value="3100">Рожь ≈ 3100 грн / т"</option>
<option value="2400">Кукуруза ≈ 2400 грн / т"</option>
<option value="1850">Просо ≈ 1850 грн / т"</option>
</select>
Можно с помощью метода selectedIndex получить текущий индекс
var select = document.getElementById('agriculture');
var button = document.getElementById('buttonID');
var selectedValue = select.options[select.selectedIndex].value;
button.addEventListener('click', event => console.log(selectedValue));
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
После запуска без отладки выполняет первую строку и просит ввести данные и завершает программу c кодом -1073740791