三个问题：

Question

所以，我正在尝试验证输入字段，其中输入字段不能为空。如果有人未在输入字段中输入任何文本并单击“开始新游戏”按钮，则应显示一条警告消息，说明您需要输入名称。

但是，由于某种原因，我的代码不会显示警告消息这是我的代码。

<html>

<head>
  <title>Tic Tac Toe</title>
</head>
<script>
  function myFunction() {
    if (document.getElementById(“playerNameNew").innerHTML == null) {
      alert("Name must be filled out");
      return false;
    }
  }
</script>

<body>
  <header>
    <h1>Tic - Tac - Toe</h1>
  </header>
  <h3>Start a new Game</h3>
  <input type="text" id="playerNameNew" placeholder="Enter your name" required>
  <button onclick="myFunction()" id="new">Start a New Game</button>
</body>

</html>

Answer 1

三个问题：

getElementById是一个对象，但是，您真正想要的是将该函数称为跟随getElementById(...)。
.innerHTML返回HTML而不是输入的值。
您必须与空值进行比较而不是空值（使用函数.trim()）。

建议：使用函数.addEventListener()绑定点击事件。

<html>

<head>
  <title>Tic Tac Toe</title>
</head>
<script>
  function myFunction() {
    if (!document.getElementById("playerNameNew").value.trim()) {
      alert("Name must be filled out");
      return false;
    }
  }
</script>

<body>
  <header>
    <h1>Tic - Tac - Toe</h1>
  </header>
  <h3>Start a new Game</h3>
  <input type="text" id="playerNameNew" placeholder="Enter your name" required>
  <button onclick="myFunction()" id="new">Start a New Game</button>
</body>

</html>

Answer 2

  if (document.getElementById("playerNameNew").value == '') {
    alert("Name must be filled out");
    return false;
  }

Javascript - 单击此按钮连接到函数

2 个答案:

三个问题：