Не работает скрипт по установке button состояния disabled

Question

Я пытаюсь установить для button состояние disabled в том случае, если в форме не заполнены определённые поля, но скрипт почему-то не работает

let userName = document.getElementById("name");
let userEmail = document.getElementById("email");
let button = document.getElementById("send");

function checkForm() {
  if (userName === false || userEmail === false) {
    button.disabled = true;
  } else {
    button.disabled = false;
  }
}

checkForm();

form {
  display: flex;
  flex-direction: column;
  width: 200px;
}

input,
select {
  margin-bottom: 10px;
}

<form action="/">
  <input type="text" placeholder="Ваше имя" id="name">
  <input type="text" placeholder="Эл. почта" id="email">
  <select name="city">
    <option selected disabled>Выберите город</option>
    <option value="Москва">Москва</option>
    <option value="Санкт-Петербург">Санкт-Петербург</option>
    <option value="Екатеринбург">Екатеринбург</option>
    <option value="Новосибирск">Новосибирск</option>
  </select>
  <button id="send">Отправить</button>
</form>

Answer 1

Во первых вы сравнивали инпут с false, а надо сравнивать значение инпута

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

В третьих, если вам очень сильно хочется сравнивать с false, тогда вам надо использовать обычное сравнение ==, а не строгое сравнение ===. Но делать так вам настоятельно не рекомендую

Код:

const userName = document.getElementById('name');
const userEmail = document.getElementById('email');
const button = document.getElementById('send');

function checkForm() {
 button.disabled = userName.value === '' || userEmail.value === '';
}

checkForm();

form {
  display: flex;
  flex-direction: column;
  width: 200px;
}

input,
select {
  margin-bottom: 10px;
}

<form action="/">
  <input type="text" placeholder="Ваше имя" id="name">
  <input type="text" placeholder="Эл. почта" id="email">
  <select name="city">
    <option selected disabled>Выберите город</option>
    <option value="Москва">Москва</option>
    <option value="Санкт-Петербург">Санкт-Петербург</option>
    <option value="Екатеринбург">Екатеринбург</option>
    <option value="Новосибирск">Новосибирск</option>
  </select>
  <button id="send">Отправить</button>
</form>

БЛОГ НА HUSL

Не работает скрипт по установке button состояния disabled

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