有没有办法让函数检查值？
[英]Is there a way to make a function check values?
问题描述
Its me again!
又是我！
I am trying to find a value of a input and check if the value is a certain string after a button is pressed.我正在尝试查找输入的值，并在按下按钮后检查该值是否为某个字符串。 It is confusing, but here is my code:这令人困惑，但这是我的代码：
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>
That all works, although I dont think the onclick="check" works since it doesnt even run the function because as you can see in the code it is supposed to log something but it doesnt even log that so Im a bit confused.这一切都有效，尽管我不认为onclick="check"有效，因为它甚至不运行该函数，因为正如您在代码中看到的那样，它应该记录一些东西，但它甚至没有记录下来，所以我有点困惑。
There is no other error messages apart from that and "emergencysucess.html" is a file.除此之外没有其他错误消息，“emergencysucess.html”是一个文件。
Could you help?你能帮忙吗？
Dont be confused, it does log script at the start of the .js file.不要混淆，它会在 .js 文件的开头记录脚本。
Thanks!谢谢！
2 个解决方案
解决方案1
0 2021-06-24 18:23:45
You have 2 reasons for why this is not working:您有两个原因可以解释为什么这不起作用：
- In
onclickyou don't write a function, you need to call the function.在onclick你不写函数，你需要调用函数。 - When you use
type="submit"the html will try to send the form to youraction.当您使用type="submit"，html 将尝试将表单发送到您的action。 If you don't want that to happen, you need toreturn falsefrom theonclick.如果您不想发生这种情况，则需要从onclickreturn 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>
解决方案2
0 2021-06-24 18:32:29
You need to use event.preventDefault() to stop the default action of the submit button.您需要使用event.preventDefault()来停止提交按钮的默认操作。
https://developer.mozilla.org/en-US/docs/Web/API/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.