JSFiddle - React, Tailwind, and code Playground

by SpeakeazyYT

HTML

<div class="pb-10 col-md-12">
  <a id="inner_area"></a>
  <label>Внутреняя площадь дома, м2</label>
  <input type="number" value=100 maxlength="100" class="form-control" name="inner_area" id="area">
</div>
<div class="pb-10 col-md-12">
  <label>Количество этажей</label>
  <input type="number" value=1 maxlength="100" class="form-control" name="floors" id="floors">
</div>

JavaScript

const area = document.querySelector('#area')
const floors = document.querySelector('#floors')

area.addEventListener('change', refresh)
floors.addEventListener('change', refresh)

function refresh() {
  var value = area.value

  var notify = function(mess) {
    document.getElementById('inner_area').innerHTML = mess;
  }

  const twoFloors = (floors.value == 2)

  if (value > 300) {
    notify("Дома рассчитываются индивидуально!<br>");
    value = 300;
  } else if (twoFloors && value < 120) {
    notify("Дома рассчитываются индивидуально!<br>");
    value = 120;
  } else if (value < 90) {
    notify("Дома рассчитываются индивидуально!<br>");
    value = 90;
  } else {
    notify("")
  }

  area.value = value;
}