gpt4 book ai didi

javascript - 当我在 HTML 中对 JS 函数使用 onkeyup 时,为什么控制台显示我的函数未定义?

转载 作者:行者123 更新时间:2023-11-28 14:38:07 25 4
gpt4 key购买 nike

我正在尝试制作一个注册表单,其中有一个用于确认您的密码的文本框。

<!DOCTYPE html>
<html>

<head>
<style>
label {
display: inline-block;
width: 100px;
margin-bottom: 10px;
}

body {
font-family: sans-serif;
}
</style>

<title>Register</title>
</head>

<body>
<h2>Register</h2>
<form method="post" action="">
Username:<br>
<input type="text" name="username"><br><br> Email Addres: <br>
<input type="text" name="email"><br><br> Password:
<br>
<input type="text" name="password"><br><br> Confirm Password:<br>
<input type="text" name="passwordconf" onkeyup="passVal()"><br><br>
<input type="submit" value="Submit">
</form>
</body>

</html>
<script>
var pass = document.getElementsByName("password");
var confPass = document.getElementsByName("passwordconf");

function passVal() {
if (pass.value != confPass.value) {
confPass.setCustomValidity("Passwords don't match");
} else {
confPass.setCustomValidity("");
}
}
</script>

其目的是,每当释放一个键(onkeyup)时,就会运行一个函数来检查文本框的内容是否相等(passVal)。当我运行它时,将文本添加到两个密码框中,控制台中会显示错误,指出 passVal 未定义。

我尝试使 passval 等于变量

var variableExample = passVal;

并使用onkeyup来调用变量,但这没有什么区别。除了现在控制台说未定义variableExample而不是passVal。我不知道为什么这不起作用。有人知道我该如何解决这个问题吗?

最佳答案

<!DOCTYPE html>
<html>

<head>
<style>
label {
display: inline-block;
width: 100px;
margin-bottom: 10px;
}

body {
font-family: sans-serif;
}
</style>

<title>Register</title>
</head>

<body>
<h2>Register</h2>
<form method="post" action="">
Username:<br>
<input type="text" name="username"><br><br> Email Addres: <br>
<input type="text" name="email"><br><br> Password:
<br>
<input type="text" name="password"><br><br> Confirm Password:<br>
<input type="text" name="passwordconf" onkeyup="passVal()"><br><br>
<input type="submit" value="Submit">
</form>
</body>

</html>
<script>
var pass = document.getElementsByName("password")[0];
var confPass = document.getElementsByName("passwordconf")[0];

function passVal() {
if (pass.value != confPass.value) {
console.log('Not equal');
} else {
console.log('Equal');
}
}
</script>

如果通过.getElementsByName()查询,您将获得一个元素数组,如 .getElementsByTagName() 一样。 。请注意,“Element”是复数。

如果你只想要一个元素,只需使用 .getElementsById() .

关于javascript - 当我在 HTML 中对 JS 函数使用 onkeyup 时,为什么控制台显示我的函数未定义?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49185238/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com