Чудеса с input через переменную и без

Question

Чудеса с input через переменную и без

Рейтинг: 2Ответов: 1Опубликовано: 10.07.2023

Пишу интерактивную страничку бинарного поиска, где пользователь сам вводит значения границ массива, искомого значения и т.д. Нахожусь на стадии валидации поля искомого числа, чтобы оно не вываливалось за пределы массива. Логика проста, если число больше или меньше границ массива - выводится алерт с ошибкой и значение инпута сбрасывается до значения по умолчанию:

let num = document.querySelector('.main__input-number').value

if (num > max || num < min) {
    alert('Wrong number!\nCheck if it is included in the array interval and try again.');
    num = 1;
}

В таком случае, сброс значения инпута до единицы происходить не будет (непонятно почему), но если отказаться от переменной num, просто использовать селектор, то сброс происходит:

let num = document.querySelector('.main__input-number').value

if (num > max || num < min) {
    alert('Wrong number!\nCheck if it is included in the array interval and try again.');
    document.querySelector('.main__input-number').value = 1;
}

Помогите, пожалуйста, объяснив почему инпут не хочет принимать значение через переменную, ведь так код смотрится красивее и отказываться от такого способа не хочется. Заранее спасибо

javascript переменные input

Источник: Stack Overflow на русском

Answer 1

▲ 1Принят

Так невозможно сделать, потому что сам язык это не позволяет.

Но есть обходной путь: создать функцию, а потом вызывать её:

let input = document.querySelector('.main__input-number')

function changeValue(value) {
    input.value = value;
}

if (+input.value > max || +input.value < min) {
    alert('Wrong number!\nCheck if it is included in the array interval and try again.');
    // 1 - значение, которое вам нужно
    changeValue(1);
}

Либо, можно вообще сделать так:

let input = document.querySelector('.main__input-number')

if (+input.value > max || +input.value < min) {
    alert('Wrong number!\nCheck if it is included in the array interval and try again.');
    // 1 - значение, которое вам нужно
    input.value = 1;
}

Как видите, всё просто и никаких "чудес" нет.

Чудеса с input через переменную и без

Ответы