[英]Is there a way to make a function check values?
又是我!
我正在尝试查找输入的值,并在按下按钮后检查该值是否为某个字符串。 这令人困惑,但这是我的代码:
var codeenter = document.getElementById("code") console.log("Script") function check() { var codecheck = codeenter.value; console.log("Started, you have clicked it.") if (codecheck === "109843") { document.getElementById("wel").innerHTML = "Hey, Sam King" } }
#title { font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: xx-large; text-align: center; } html { font-family: Verdana, Geneva, Tahoma, sans-serif; text-align: center; } #button { width: 20em; height: 2em; background-color: aliceblue; border: none; } #name { text-align: center; object-position: center; margin: auto 0px; } #code { text-align: center; } #emsub { background-color: aquamarine; border: none; width: 10em; height: 2em; }
<!DOCTYPE html> <title>Emergency Login</title> <link rel="stylesheet" href="./style.css"> <body> <form action="./emergencysucess.html"> <input type="text" id="code" placeholder="Emergency Code"> <input type="text" id="name" placeholder="Your Name"> <br> <button type="submit" id="emsub" onclick="check">Login</button> </form> </body> <script src="./script.js"></script>
这一切都有效,尽管我不认为onclick="check"
有效,因为它甚至不运行该函数,因为正如您在代码中看到的那样,它应该记录一些东西,但它甚至没有记录下来,所以我有点困惑。
除此之外没有其他错误消息,“emergencysucess.html”是一个文件。
你能帮忙吗?
不要混淆,它会在 .js 文件的开头记录脚本。
谢谢!
您有两个原因可以解释为什么这不起作用:
onclick
你不写函数,你需要调用函数。type="submit"
,html 将尝试将表单发送到您的action
。 如果您不想发生这种情况,则需要从onclick
return false
。 var codeenter = document.getElementById("code") console.log("Script") function check() { var codecheck = codeenter.value; console.log("Started, you have clicked it.") if (codecheck === "109843") { document.getElementById("wel").innerHTML = "Hey, Sam King" } }
#title { font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: xx-large; text-align: center; } html { font-family: Verdana, Geneva, Tahoma, sans-serif; text-align: center; } #button { width: 20em; height: 2em; background-color: aliceblue; border: none; } #name { text-align: center; object-position: center; margin: auto 0px; } #code { text-align: center; } #emsub { background-color: aquamarine; border: none; width: 10em; height: 2em; }
<form action="./emergencysucess.html"> <input type="text" id="code" placeholder="Emergency Code"> <input type="text" id="name" placeholder="Your Name"> <br> <button type="submit" id="emsub" onclick="check(); return false">Login</button> </form> <div id="wel"></div>
您需要使用event.preventDefault()
来停止提交按钮的默认操作。
https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault
var codeenter = document.getElementById("code") console.log("Script") function check(event) { event.preventDefault(); var codecheck = codeenter.value; console.log("Started, you have clicked it.") if (codecheck === "109843") { document.getElementById("wel").innerHTML = "Hey, Sam King" } }
#title { font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: xx-large; text-align: center; } html { font-family: Verdana, Geneva, Tahoma, sans-serif; text-align: center; } #button { width: 20em; height: 2em; background-color: aliceblue; border: none; } #name { text-align: center; object-position: center; margin: auto 0px; } #code { text-align: center; } #emsub { background-color: aquamarine; border: none; width: 10em; height: 2em; }
<!DOCTYPE html> <title>Emergency Login</title> <link rel="stylesheet" href="./style.css"> <body> <form action="./emergencysucess.html"> <input type="text" id="code" placeholder="Emergency Code"> <input type="text" id="name" placeholder="Your Name"> <br> <button type="submit" id="emsub" onclick="check(event)">Login</button> </form> <p id="wel" /> </body> <script src="./script.js"></script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.