JavaScript警报onclick onchange if语句

我试图显示一个onclick警报，如果框中填充了世界“hello”，而在没有键入“hello”时，另一个警报应该会弹出。 不确定我在这里做错了什么：

HTML：

<form>
<input id="box" placeholder="type hello" onchange="sayHello()" style="display: block;" />
<input type="button" onclick="sayHelloTwo()" value="Click me" />
<p id="hidden" style="display: none;">
 HELLO
</p>
</form>

---

您需要检查用户在框中输入的实际值，然后将其与您想要的值（

answer

变量中的值）进行比较

有几种方法可以做到这一点，其中一种是使用

document.getElementById('box').value

（其中，

box

是元素的

id

）

以下是一个工作示例：

函数sayHello（）{
var answer=“你好”；
var text=document.getElementById（'box'）。值；
如果（文本==答案）{
警报（“点击打招呼！”）；
}否则{
警报（“您需要键入hello！”）；
返回false；
}
}
函数sayHelloTwo（）{
document.getElementById（“隐藏”）.style.display=“块”；
document.getElementById（“隐藏”）.style.color=“#9090”；
document.getElementById（“隐藏”）.style.fontSize=“40px”；
}

你好

要详细说明Dekels的答案，click事件还附带了一个事件属性，您可以使用该属性获取值，如下所示

function sayHello(e) {

  if (e.currentTarget.value == "hello") {
    alert("Click for Hello!");
  } else {
    alert("you need to type hello!");
    return false;
  }
}

---

您可以在html中将元素值作为参数

this.value

直接传递

请注意，要使代码不区分大小写，必须将值转换为小写，然后检查if语句

value.toLowerCase（）！='您好“

代码：

函数sayHello（值）{
if（value.toLowerCase（）！=='hello'）{
警报（'您需要键入hello！'）；
返回false；
}
警报（'点击打招呼！'）；
}
函数sayHelloTwo（）{
var hidden=document.getElementById（'hidden'）
hidden.style.display='block'；
hidden.style.color='#9090'；
hidden.style.fontSize='40px'；
}

你好

您在检查答案的条件时出错

function sayHello() {
    var answer = "hello";
    if (answer == "hello") {
        alert("Click for Hello!");
    } else {
        alert("you need to type hello!");
        return false;
    }
}

---

非常感谢。这正是我想要的。

function sayHello() {
    var answer = "hello";
    if (answer == "hello") {
        alert("Click for Hello!");
    } else {
        alert("you need to type hello!");
        return false;
    }
}