时间戳

首页 > 解决方案 > 当表单中的 onsubmit 事件只有第一个函数工作时，我想返回所有 3 个函数为 true

javascript - 当表单中的 onsubmit 事件只有第一个函数工作时，我想返回所有 3 个函数为 true

问题描述

用于检查电子邮件的 Ajax 代码是新的还是现有的

我希望这三个功能return(checkpass() && check() && validate(this))都能正常工作。目前只有该功能checkpass()有效。如果我写return(check() && checkpass() && validate(this))，只有check()函数被触发。

function check(){
    var uname=document.forms["register_form"]["uname"].value;
    var uemail=document.forms["register_form"]["uemail"].value;
    var upassword=document.forms["register_form"]["upassword"].value;
    var ucpassword=document.forms["register_form"]["ucpassword"].value;

    if(uname=="" || uemail=="" || upassword=="" || ucpassword==""){
        alert("all fields must be filled out");
        return false;
    }
}
function checkpass(){
    var upass=document.forms["register_form"]["upassword"].value;
    var ucpass=document.forms["register_form"]["ucpassword"].value;
    if(upass!=ucpass){
        alert("Confirm password should be same as password");
        return false;
    }
    if(upass=="" && ucpass==""){
        alert("cannot be kept blank");
        return false;
    }
}
function validate(useremail){
    xhttp =new XMLHttpRequest();
    xhttp.open("GET","emailvalidate.php?uemail="+useremail,true);
    xhttp.send();
    xhttp.onreadystatechange=function(){
        if (xhttp.readyState == 4) {
            if(xhttp.responseText==""){
                document.getElementById("alert").innerHTML="cannot be empty";
                return false;
            }
            else if(xhttp.responseText=="OK"){
                document.getElementById("alert").innerHTML="<span class='badge badge-pill badge-primary'>welcome new user</span>";
            }
            else if(xhttp.responseText=="NO"){
                document.getElementById("alert").innerHTML="<span class='badge badge-pill badge-primary'>Email Already Exist</span>";
                return false;
            }
            else{
                document.getElementById("alert").innerHTML="error happened";
                return false;
            }
        }
    };
}
<form method="post" action="register_action.php" id="register_form" name="register_form" onsubmit="return (checkpass() && check() && validate(this));">
    <br>
    <div class="form-group">
        <label for="uname">Name:</label>
        <input type="text" class="form-control" id="uname" placeholder="Enter Name " name="uname">
    </div>
    <div class="form-group">
        <label for="uemail">Email id: </label>
        <input type="email" class="form-control" id="uemail" placeholder="Enter Email ID" name="uemail"
               onkeyup="javascript:validate(this.value)"><br>
        <span id="alert"></span>
    </div>
    <div class="form-group">
        <label for="upassword">Enter Password:</label>
        <input type="password" class="form-control" id="upassword" placeholder="Set password" name="upassword">
    </div>
    <div class="form-group">
        <label for="ucpassword">Confirm Password:</label>
        <input type="password" class="form-control" id="ucpassword" placeholder="Enter password again" name="ucpassword" >
    </div>
    <button type="submit" class="btn btn-success">Submit</button>
</form>

标签： javascriptajax

解决方案

为什么不将它们包装在一个函数中：

var wrapper = function(){
   return checkpass() && check() && validate(this);
}

接着

<form onsubmit="javascript:wrapper()">

此外，您可以对这个函数链进行 curry 以提高可读性，但是，上面的示例必须解决您的问题。

推荐阅读