javascript - 双重警报窗口

我得到了两种形式的警报提示：第一次弹出警报，然后单击“确定”，再次弹出相同的警报。我认为我的代码在遇到“ else window.alert（sameWarning）”时应该执行一次警报，并在到达“ return false（）”时停止；但是似乎return false（）导致了两次警报。也许是因为我一页上有两个表单；但是它们有两个单独的函数名（“ signinForm（）”和“ saveSignUp（）”）并调用两个单独的表单（forms [0]和forms [1]）吗？我认为我的代码是正确的，但目前无法解决，请提供任何帮助，在此先感谢！

<script type="text/javascript">
//FIRST FUNCTION FOR FORMS[0]
function signinForm(){

        // var sameWarning = "The required fields were not submitted for the following error(s).  \n \n";
        var warningLogin = "The following field(s) require an entry: \n \n";
        var sameWarning = warningLogin;

        var userName = document.forms[0].userName.value;
        var pswd = document.forms[0].pswd.value;

        if(userName == ""){
        sameWarning += " - First Name \n";
        }

        if(pswd == ""){
        sameWarning += " - Password \n";
        }

        if (warningLogin == sameWarning){
            return true;
            }

        else  {
            window.alert(sameWarning);
        }
    return false;
   }

//SECOND FUNCTION CALL FOR FORMS[1]
function saveSignUp(){

        // var warning = "The required fields were not submitted for the following error(s).  \n \n";
        var warning = "The following field(s) require an entry: \n \n";
        var same = warning;

        var firstName = document.forms[1].firstName.value;
        var lastName = document.forms[1].lastName.value;
        var email = document.forms[1].email.value;
        var phone = document.forms[1].phoneNumber.value;

        if(firstName == ""){
        //firstName.style.backgroundColor="red";
        warning += " - First Name \n";
        }

        if(lastName == ""){
        warning += " - Last Name \n";
        }

        if(email == ""){
        warning += " - Email \n";
        }

        if(phone == ""){
        warning += " - Work Phone \n";
        }

        if(phone < 5 ){
            warning += " - Must be a numberssss \n";
            }

        if (warning == same){
            return true;
        }

        else  {
            alert(warning);
        }
    return false;
   }

</script>

的HTML

<h1>Login</h1>
<form method="post" onsubmit="return signinForm();" action="" >
    <input type="text" placeholder="Username/Email" name="userName">
    <input type="password" placeholder="Password" name="pswd" id="pswd">
    <input type="submit" onclick="signinForm();" value="Sign In">
</form>
<h1>Sign Up!</h1>
    <form method="post" onsubmit="return saveSignUp()" action="" >
    <input type="text" placeholder="First Name" name="firstName">
    <input type="text" placeholder="Last Name" name="lastName">
    <input type="text" placeholder="Email" name="email">
    <input type="text" placeholder="Phone Number" name="phoneNumber">
    <input type="submit" onclick="saveSignUp();" class="button wide" value="Request an Account">

最佳答案

这是因为您两次呼叫signinForm();。

删除这些监听器之一

onclick="signinForm();"

onsubmit="return signinForm()"

当您单击提交按钮时，您呼叫signinForm();。并且由于它是一个submit按钮，它将触发onsubmit事件，并调用return signinForm()