Javascript true 或 false 测试不会输出任何内容

Javascript true or false test won't output anything

function sub() {
  var num1 = parseInt(document.getElementById("imp").value);
  var yes = "Yup!"
  var no = "Nope..."
  if (imp == "true") {
    output(yes);
  } else if (imp == "false") {
    output(no)
  }
}
    
function output(x) {
  document.getElementById("result").innerHTML = x;
}
body {
  background:green;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: 'Roboto', sans-serif !important;
}
h1 {
  text-align: center;
  color: #ffffff;
  font-size: 4em;
  text-shadow: 4px 4px #000000;
}

p {
  text-align: center;
  color: #ffffff;
  font-size: 4em;
  text-shadow: 4px 4px #000000;
}
<p>TRUE OR FALSE</p>
<p>Polar bears have black skin.</p>
<input type="text" id="imp">
<button onclick="sub()">Submit</button>
<div id="result"></div>

首先,您似乎是要检查 num1 的值而不是 imp (它在您的代码中不存在,但是是您要获取的元素的名称值)。我只是将变量名称更改为 userInput 以使其更清楚这就是您从用户那里得到的。

其次,您希望用户提供“true”或“false”字符串来进行检查,但您正试图将其转换为整数。删除 parseInt()。我在末尾添加了 toLowerCase(),以防止在用户使用任何大写字母的情况下出现错误('True'、'False'、'tRuE'、'fAlSe' 等) .

最后,如果用户没有输入 'true' 或 'false'(总是如果用户输入了任何不寻常或意外的内容,你的 UI 可以防止白痴。

function sub() {
  var userInput = document.getElementById("imp").value.toLowerCase();
  var yes = "Yup!";
  var no = "Nope...";
  var idk = "Invalid input";

  if (userInput == "true") {
    output(yes);
  } else if (userInput == "false") {
    output(no);
  } else {
    output(idk);
  }
}
    
function output(x) {
  document.getElementById("result").innerHTML = x;
}
body {
  background:green;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: 'Roboto', sans-serif !important;
}
h1 {
  text-align: center;
  color: #ffffff;
  font-size: 4em;
  text-shadow: 4px 4px #000000;
}

p {
  text-align: center;
  color: #ffffff;
  font-size: 4em;
  text-shadow: 4px 4px #000000;
}
<p>TRUE OR FALSE</p>
<p>Polar bears have black skin.</p>
<input type="text" id="imp">
<button onclick="sub()">Submit</button>
<div id="result"></div>