checkForm()只输入第一个if()
checkForm() only enters the first if()
我试图使一个注册公式，它应该只在检查所有输入正确/可能后发布。所以我在这里找到了一个很好的德语教程:
http://de.selfhtml.org/javascript/beispiele/formulareingaben.htm. .然后试着把我需要的东西拿走，就像这样:
<script type="text/javascript">
function checkForm(){
if(document.getElementById("email").value =="" || eMailToCheck.indexOf("@") == -1){
alert("Bitte Emailadresse eingeben");
document.getElementById("email").focus();
return false;
}
if(document.getElementById("username").value ==""){
alert("Bitte Usernamen eingeben");
document.getElementById("username").focus();
return false;
}
if((document.getElementById("passwordOne").value != document.getElementById("passwordTwo").value)){
alert("Passwörter stimmen nicht überein");
document.getElementById("passwordOne").focus();
return false;
}
if((document.getElementById("passwordOne").value == "") || (document.getElementById("passwordTwo").value == "")){
alert("Bitte beide Passwortfelder ausfüllen");
document.getElementById("passwordOne").focus();
return false;
}
if((document.getElementById("passwordOne").value.length < 8) || (document.getElementById("passwordTwo").value.length < 8)){
alert("Passwort muss mind. 8 Zeichen beinhalten");
document.getElementById("passwordOne").focus();
return false;
}
}
</script>
在HTML的头部，并调用它
<form action="profile.html" onsubmit="return checkForm()" method="post" name="Formular">
效果令人印象深刻:
调用函数并进入第一个if()块。但前提是我在下一行中有另一个if()或什么都没有。如果我在行中有一个无条件的命令，它将不再工作。
只有电子邮件验证有效，其他都不输入。我不明白，为什么!有人能告诉我吗?
编辑:这是我的完整代码:
<html>
<head>
<title>BlackJackX</title>
<script type="text/javascript">
function checkForm(){
var flag = true;
if(document.getElementById("email").value =="" || eMailToCheck.indexOf("@") == -1){
alert("Bitte Emailadresse eingeben");
document.getElementById("email").focus();
flag=false;
}
else if(document.getElementById("username").value ==""){
alert("Bitte Usernamen eingeben");
document.getElementById("username").focus();
flag=false;
}
else if((document.getElementById("passwordOne").value != document.getElementById("passwordTwo").value)){
alert("Passwörter stimmen nicht überein");
document.getElementById("passwordOne").focus();
flag=false;
}
else if((document.getElementById("passwordOne").value == "") || (document.getElementById("passwordTwo").value == "")){
alert("Bitte beide Passwortfelder ausfüllen");
document.getElementById("passwordOne").focus();
flag=false;
}
else if((document.getElementById("passwordOne").value.length < 8) || (document.getElementById("passwordTwo").value.length < 8)){
alert("Passwort muss mind. 8 Zeichen beinhalten");
document.getElementById("passwordOne").focus();
flag=false;
}
return flag;
}
</script>
</head>
<body>
<div style="width:300px; height:175px; background-color:#DDDDDD; margin-left:auto; margin-right:auto; margin-top:150px; align:center;">
<p>
<p>
<form action="profile.html" onsubmit="return checkForm()" method="post">
<table align="center">
<br>
<tr>
<td style="text-align:right; width:25px; color:red">
<p id="emailValid" name="emailValid"></p>
</td>
<td>
Emailadresse:
</td>
<td>
<input name="email" id="email" type="text" size="15" maxlength="25" onblur="validateEmail()">
</td>
</tr>
<tr>
<td style="text-align:right; color: red">
<p id="usernameValid" name="usernameValid"></p>
</td>
<td>
Username:
</td>
<td>
<input name="username" id="username" type="text" size="15" maxlength="25" onblur="validateUsername()">
</td>
</tr>
<tr>
<td style="text-align:right; color:red" id="passwordOneValid" name="password1Valid">
</td>
<td>
Passwort:
</td>
<td>
<input style="25px" name="passwordOne" id="passwordOne" type="password" size="15" maxlength="16" style="height: 25px" onblur="validatePasswordOne()">
</td>
</tr>
<tr>
<td style="text-align:right; color:red" id="passwordTwoValid" name="passwordTwoValid">
</td>
<td>
..wiederholen:
</td>
<td>
<input style="25px" name="passwordFieldTwo" id="passwordTwo" type="password" size="15" maxlength="16" style="height: 25px" onkeyup="validatePasswordTwo()">
</td>
</tr>
<tr>
<td></td>
<td></td>
<td>
<input name="submit" id="submit" type="submit" style="width: 92px" value="Registrierung">
</td>
</tr>
</table>
</form>
<script type="text/javascript">
function validateEmail(){
var eMailToCheck = document.getElementById("email").value;
if(eMailToCheck!="" && eMailToCheck.indexOf("@") != -1){
document.getElementById("emailValid").innerHTML = "";
}
else{
document.getElementById("emailValid").innerHTML = "!";
}
}
function validateUsername(){
var usernameToCheck = document.getElementById("username").value;
if(usernameToCheck != ""){
document.getElementById("usernameValid").innerHTML = "";
}
else{
document.getElementById("usernameValid").innerHTML = "!";
}
}
function validatePasswordOne(){
var pwToCheck = document.getElementById("passwordOne").value;
if(pwToCheck != ""){
document.getElementById("passwordOneValid").innerHTML = "";
}
else{
document.getElementById("passwordOneValid").innerHTML = "!";
}
if(pwToCheck.length < 8 && pwToCheck != ""){
document.getElementById("passwordOneValid").innerHTML = "8 >";
}
}
function validatePasswordTwo(){
var pwToCheck = document.getElementById("passwordTwo").value;
if(pwToCheck != document.getElementById("passwordOne").value){
document.getElementById("passwordTwoValid").innerHTML = "!=";
}
else if(pwToCheck == document.getElementById("passwordOne").value){
document.getElementById("passwordTwoValid").innerHTML = "";
}
}
</script>
</div>
</body>
</html>
应该在函数结束时返回，否则它退出得太早(return退出)。
function checkForm(){
var result = true;
if(document.getElementById("email").value =="" || eMailToCheck.indexOf("@") == -1){
alert("Bitte Emailadresse eingeben");
document.getElementById("email").focus();
result=false;
}
if(document.getElementById("username").value ==""){
alert("Bitte Usernamen eingeben");
document.getElementById("username").focus();
result=false;
}
if((document.getElementById("passwordOne").value != document.getElementById("passwordTwo").value)){
alert("Passwörter stimmen nicht überein");
document.getElementById("passwordOne").focus();
result=false;
}
if((document.getElementById("passwordOne").value == "") || (document.getElementById("passwordTwo").value == "")){
alert("Bitte beide Passwortfelder ausfüllen");
document.getElementById("passwordOne").focus();
result=false;
}
if((document.getElementById("passwordOne").value.length < 8) || (document.getElementById("passwordTwo").value.length < 8)){
alert("Passwort muss mind. 8 Zeichen beinhalten");
document.getElementById("passwordOne").focus();
result=false;
}
return result;
}
当然，它只会输入第一个if，因为在每个if条件中都有一个返回语句。在语句的末尾放一个return语句。把你的代码改成:-
<script type="text/javascript">
function checkForm(){
var flag=true;
if(document.getElementById("email").value =="" || eMailToCheck.indexOf("@") == -1){
alert("Bitte Emailadresse eingeben");
document.getElementById("email").focus();
flag= false;
}
if(document.getElementById("username").value ==""){
alert("Bitte Usernamen eingeben");
document.getElementById("username").focus();
flag= false;
}
if((document.getElementById("passwordOne").value != document.getElementById("passwordTwo").value)){
alert("Passwörter stimmen nicht überein");
document.getElementById("passwordOne").focus();
flag= false;
}
if((document.getElementById("passwordOne").value == "") || (document.getElementById("passwordTwo").value == "")){
alert("Bitte beide Passwortfelder ausfüllen");
document.getElementById("passwordOne").focus();
flag= false;
}
if((document.getElementById("passwordOne").value.length < 8) || (document.getElementById("passwordTwo").value.length < 8)){
alert("Passwort muss mind. 8 Zeichen beinhalten");
document.getElementById("passwordOne").focus();
flag= false;
}
return flag;
}
</script>
改变这一行:
if(document.getElementById("email").value =="" || eMailToCheck.indexOf("@") == -1){:
if(document.getElementById("email").value =="" || document.getElementById("email").value.indexOf("@") == -1){您应该检查错误在最后，如果它存在，然后return false，否则让表单提交。看，这将为您工作。
<script type="text/javascript">
function checkForm(){
var errorCounter=0;
if(document.getElementById("email").value =="" || document.getElementById("email").value.indexOf("@") == -1){
alert("Bitte Emailadresse eingeben");
document.getElementById("email").focus();
errorCounter++;
}
if(document.getElementById("username").value ==""){
alert("Bitte Usernamen eingeben");
document.getElementById("username").focus();
errorCounter++;
}
if((document.getElementById("passwordOne").value != document.getElementById("passwordTwo").value)){
alert("Passwörter stimmen nicht überein");
document.getElementById("passwordOne").focus();
errorCounter++;
}
if((document.getElementById("passwordOne").value == "") || (document.getElementById("passwordTwo").value == "")){
alert("Bitte beide Passwortfelder ausfüllen");
document.getElementById("passwordOne").focus();
errorCounter++;
}
if((document.getElementById("passwordOne").value.length < 8) || (document.getElementById("passwordTwo").value.length < 8)){
alert("Passwort muss mind. 8 Zeichen beinhalten");
document.getElementById("passwordOne").focus();
errorCounter++;
}
if(errorCounter>0)
return false;
}
</script>
编辑:实际上问题是eMailToCheck.indexOf("@")这里eMailToCheck没有定义，但正在使用，所以我只是把它改成了document.getElementById("email").value.indexOf("@")，它解决了问题。
相关文章：
- 而循环只设置php中输入字段中的第一个值
- 错误:$injector:modulerr模块错误(我的第一个SPA应用程序）
- IE11中的第二个调用取消了第一个Fetch API调用
- Javascript XMLHttpRequest——只有第一个POST请求有效
- 使用javascript或angularjs特定过滤器搜索字符串中第一个img标记的json值
- 将OnClick函数设置为<ul>，最后一个ul是擦除第一个ul-s
- RxJS油门行为;立即获取第一个值
- 普通JS:使80%宽度元素100%IF包含一个图像
- Angular UI网格:如何通过第一个UI网格中的按钮使第二个UI网格可见
- 选择多个实例中的第一个
- 如何在调用下一个请求之前完成第一个Ajax Get请求
- Lodash:返回对象的第一个键，该对象的值(即数组）中有一个给定的元素(即字符串）
- 看起来第一个console.log是'It’不太对
- 与杜兰达尔合作的第一个JavaScript项目.尝试从第三方 API 获取数据
- 节点发布错误对象的第一个“属性”
- 使用if计算基于年龄的点数.Else语句中，脚本只显示第一个值
- 多个if但只运行第一个?javascript
- checkForm()只输入第一个if()
- 为什么即使第一个if语句为真，它也会跳过并继续
- if 语句 - 我的第一个 IF 不起作用，但我的 else if 和 else 部分可以工作 javascript
