Почему не работает проверка на ввод в input?

Question

document.addEventListener('DOMContentLoaded', function() {
    if (document.querySelector(".input").value.length >= 1) {
        document.querySelector(".blockk").style.display = 'none';
    }
});

<input class="input" type="text" placeholder="Washington, D.C.">
<span class="blockk">Required</span>

Answer 1

потому что placeholder показывает некоторый текст, когда в поле ввода ничего нет

у вас в поле ввода ничего нет, поэтому показывается Washington, D.C., но при этом .value.length равно 0, поскольку... в поле ввода ничего нет :)

если по умолчанию сделать некоторое заполнение поля ввода, то все будет работать корректно

window.addEventListener('DOMContentLoaded', function() {
    if (document.querySelector(".input").value.length >= 1) {
        document.querySelector(".blockk").style.display = 'none';
    }
});

<input class="input" type="text" placeholder="Washington, D.C." value = "XXX">
<span class="blockk">Required</span>

Если вы хотите, чтобы при вводе текста исчезал блок, то отслеживать надо уже другие события

document.querySelector(".input").addEventListener('input', function() {
  document.querySelector(".blockk").style.display = (document.querySelector(".input").value.length > 0) ? 'none' : 'inline-block'; 
});

<input class="input" type="text" placeholder="Washington, D.C.">
<span class="blockk">Required</span>

БЛОГ НА HUSL

Почему не работает проверка на ввод в input?

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