<input type="number" class="form-control" id="amount" value="1" min="1" max="10">
<label for="">Выберите план</label>
<select class="fotm-control custom-select mb-4" id="plan" name="" placeholder="Select">
<option value="1.5" data-min="1" data-max="10">Низкий</option>
<option value="2.2" data-min="11" data-max="30">Средний</option>
<option value="2.7" data-min="31" data-max="60">Высокий</option>
<option value="3.2" data-min="61" data-max="100">Супервысокий</option>
</select>
const plan = document.getElementById('plan')
const ammount = document.getElementById('amount')
const checkAmmount = _ => {
const selected = plan.querySelector('option:checked')
ammount.setAttribute('min', selected.dataset.min)
ammount.setAttribute('max', selected.dataset.max)
ammount.value = Math.min(Math.max(ammount.value, selected.dataset.min), selected.dataset.max)
}
plan.addEventListener ('change', checkAmmount)
ammount.addEventListener('blur', checkAmmount)
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.