Всем привет! Начинаю потихоньку изучать JavaScript и JQuery. Появилась проблема, которую уже не могу решить несколько часов. Я пишу некое подобие калькулятора, в котором имеются select и input. Я реализовал первую функцию, которая при изменении option:selected меняет общие данные подсчета.
Вопрос: Как мне реализовать функцию, при которой будут высвечиваться изменения после редактирования значений в input?
JS
$(document).ready(function () {
$("#mat").change(function () {
const money = [1000, 800, 750];
const hgt = parseInt(document.getElementById("height1").value);
const wdt = parseInt(document.getElementById("width1").value);
var result;
var opt = $('.form1 option:selected').val();
if (opt == '0') {
result = money[0] * (hgt/100 * wdt);
$('#rezult').text('Цена забора составит: ' + result + ' руб.');
} else if (opt == '1') {
result = money[1] * (hgt/100 * wdt);
$('#rezult').text('Цена забора составит: ' + result + ' руб.');
} else {
result = money[2] * (hgt/100 * wdt);
$('#rezult').text('Цена забора составит: ' + result + ' руб.');
}
});
});
HTML:
<div class="calculator">
<h1 class="header--text">Калькулятор стоимости забора</h1>
<form action="" class="form1">
<select name="" id="mat">
<option value="0" selected>Дерево</option>
<option value="1">Металл</option>
<option value="2">Пластик</option>
</select><br><br>
Высота, см.: <input type="number" id="height1" min="50" min="5000"><br><br>
Длина, м.: <input type="number" id="width1" min="10" min="10000"><br><br>
<input type="submit" value="Результат" id="btn">
</form>
<div id="rezult"></div>
</div>
hgt / 100 * wdt
→wdt * hgt / 100
это одно и то же. При этом второй вариант точнее показывает, что вы имели в виду) Первый наводит на мысли, что вдруг ошиблись, и имелось в видуhgt / ( 100 * wdt )