结果 - 在线编辑器

          <p>请提供以下信息。标有 “*” 的项目为必填项。</p>
<form action="" method="get">
  <p>
    <label for="userName" required>你的名字：</label>
    <input type="text" id="userName"> (*)
  </p>
  <p>
    <label for="email">邮箱：</label>
    <input type="email" id="userEmail">
  </p>
  <input type="submit" value="发送" id="sendButton">
</form>

<script>
const nameField = document.getElementById("userName");
const sendButton = document.getElementById("sendButton")

sendButton.disabled = true;
nameField.focus();

nameField.addEventListener("input", event => {
  const elem = event.target;
  const valid = elem.value.length != 0;

  if (valid && sendButton.disabled) {
    sendButton.disabled = false;
  } else if (!valid && !sendButton.disabled) {
    sendButton.disabled = true;
  }
});
</script>

        