Как сохранить данные в переменную только 1 раз?

Question

Есть 2 поля формы: 1 - select с несколькими параметрами и 2 - input. Нужно при смене опций в select менять изначально введенное значение в input.

<select>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<input type="text">

При выборе 1 мы умножаем число из input 1, если выбираем 2-й option, то мы должны умножить именно 1 введенное число, а не результат, который получен из 1 select + запись в input.

Answer 1

Нужна внешняя переменная, которая будет хранить последнее введенное значение в input.

let input = document.querySelector("#input");
let select = document.querySelector("#select");

let init_value = Number(input.value); // Начальное значение

input.addEventListener("input", function() {
  init_value = Number(this.value); // Меняется, когда вручную меняют значение input.

  select.selectedIndex = 0; // Сброс на option-1
  
  // или init_value = this.value / select.value;
  // т.е. если введут 40, а на select уже выбрано 2, init_value станет 20.
});

select.addEventListener("change", function() {
  input.value = init_value * this.value;
  // this.value = по совместительству, строка внутри выбранного option
});

<select id="select">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

<input id="input" value="20">

Внутри обработчика select... this.value - строка. Операция умножения и так автоматически превращает её в число. А было бы там суммирование - пришлось бы её тоже отдельно превращать в число.

БЛОГ НА HUSL

Как сохранить данные в переменную только 1 раз?

Ответы (1 шт):