Отключить текстовое поле и поле выбора

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

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

 <html>

<head>
  <script>
    function success() {
      if (document.getElementById("uname").value === "" || document.getElementById("age").value === "" || document.getElementById("sex").selectValue == "Please Select") {
        document.getElementById('submit_form').disabled = true;

      } else {
        document.getElementById('submit_form').disabled = false;
      }
    }
  </script>

  <style>

  </style>
</head>

<body>
  Name: <input type="text" id="uname" onkeyup="success()"/> Age: <input type="text" id="age" onkeyup="success()"/> Sex:
  <select id="sex" name="sex">
  <option value="" selected="selected"> Please Select </option>
  <option value="Male"> Male </option>
  <option value="Female"> Female </option>
  </select>
  <input type="submit" name="submit" id="submit_form" value="Submit" disabled>
</body>

</html>

1. Вы вызываете, disable() когда у вас есть только success() функция, также ненужная / в <выберите …. />

2. Я обновил свой код. Пожалуйста, посмотрите

3. Мне нужно, чтобы кнопка отправки была отключена до тех пор, пока все поля не будут заполнены пользователем

4. Не работает. Кнопка отправки осталась отключенной

Ответ №1:

  document.addEventListener("input", function() {
  if (
   document.getElementById("uname").value == "" ||
   document.getElementById("age").value == "" ||
   document.getElementById("sex").value == ""
  ) {
   document.getElementById("submit_form").disabled = true;
  } else {
   document.getElementById("submit_form").disabled = false;
  }
});

Вот ручка:https://codepen.io/ahmetzeybek/pen/ROqLme

Ответ №2:

В jquery вы можете использовать функцию «prop», чтобы отключить поле выбора:

 <script>
$('#select_id').prop('disabled', 'disabled');
</script>

А чтобы отключить текстовое поле, вы могли бы просто добавить атрибут «только для чтения» к элементу, используя jquery:

 <script>
 $("#textboxid").attr("readonly");
</script>