繁体   English   中英

Javascript验证无法正常工作-只要if语句为真,它就会停止所有if语句?

[英]Javascript validation is not working - as soon as one if statement is true, it stops all if statements?

1st-如果填写了文本框,则代码将在此处停止,并且不会继续。

第二个-通过电子邮件,如果第一个为true,则不会检查第二个if语句。

我认为第一个问题和第二个问题都是相同的,只要看到一件事情是对的,就立即停止。

的HTML

    <form name="form" onSubmit="return validation()" method="post">
              <p>
                  <label class="tittle">Name:</label>
                  <span>
                  <input type="text" name="firstname"
                                placeholder="First Name" class="info"
                                size="25" maxlength="25" 
                                onBlur="return validateFirstName()">
                   <label class="fillerror" id="fillFirst">
                                    First name is required
            </label>
                            </span>

                            <span>
                                <input type="text" name="lastname"
                                placeholder="Last Name" class="info"
                                size="25" maxlength="25"
                                onBlur="return validateLastName()">
                                <label class="fillerror" id="fillLast">
                                    Last name is required
                                </label>
                            </span>
                        </p>


                        <p>
                            <label class="tittle">Email:</label>
                            <span>
                                <input type="text" name="newEmail"
                                placeholder="Email" class="info"
                                size="25" maxlength="50"
                                onBlur="return validateEmail()">
                                <label class="fillerror" id="fillemail">
                                    Email address is required
                                </label>
                            </span>
                            <span>
                                <input type="text" name="retypedNewEmail" 
                                placeholder="Confirm Email" class="info"
                                size="25" maxlength="50"
                                onBlur="return asd()">
                                <label class="fillerror" id="fillemailConf">
                                    Email address confirmation is required
                                </label>
                                <label class="fillerror" id="fillemailConfirm">
                                    Email addresses do not match
                                </label>
                            </span>
                        </p>
                        <p>
                            <label class="tittle">Password:</label>
                            <span>
                                <input type="password" name="newPassword"
                                placeholder="Password" class="info"
                                size="25" maxlength="15"
                                onBlur="return validatePassword()">
                                <label class="fillerror" id="fillpass">
                                    Password is required
                                </label>
                            </span>
                            <span>
                                <input type="password" 
                                name="retypedNewPassword"
                                placeholder="Confirm Password" class="info"
                                size="25" maxlength="15"
                                onBlur="return validateConfPassword()">
                                <label class="fillerror" id="fillpassConf">
                                    Password confirmation is required
                                </label>
                            </span>
                        </p>
                        <p>
                            <span id="sign">
                                <input type="checkbox" name="sign" checked>
                                Sign up for our Emails
                            </span>
                            <input type="button" name="register"
                            value="Register" class="register"
                            onClick="return validateFirstName(),
                            validateLastName(), validateEmail(),
                            validateConfEmail(), validatePassword(),
                            validateConfPassword();">
                        </p>
                        </form>

的JavaScript

function xValidate(inbox, fill)
    {
        inbox.style.backgroundColor="rgba(255, 0, 0, .1)";
        inbox.style.borderLeft="3px solid red";
        fill.style.display="block";
    }
    function yValidate(inbox, fill)
    {
        inbox.style.backgroundColor="white";
        inbox.style.borderLeft="3px solid rgb(169, 184, 1)";
        fill.style.display="none";
    }


function validateFirstName()
{   
    var frstnm = document.forms["form"] ["firstname"].value;

    if (frstnm==null || frstnm=="" || frstnm==" ")
    {
        var inbox = document.forms["form"] ["firstname"];
        var firstname = document.getElementById("fillFirst");
        xValidate(inbox, firstname);
    }
    else
    {
        var inbox = document.forms["form"] ["firstname"];
        var firstname = document.getElementById("fillFirst");
        yValidate(inbox, firstname);
    }
}   

function validateLastName()
{
    var lstnm = document.forms["form"] ["lastname"].value;

    if (lstnm==null || lstnm=="" || lstnm==" ")
    {
        var inbox = document.forms ["form"] ["lastname"];
        var lastname = document.getElementById("fillLast");
        xValidate(inbox, lastname);
    }
    else
    {
        var inbox = document.forms ["form"] ["lastname"];
        var lastname = document.getElementById("fillLast");
        yValidate(inbox, lastname);
    }
}



function validateEmail()
{
    var eml = document.forms["form"] ["newEmail"].value;

    if (eml==null || eml=="" || eml==" ")
    {
        var inbox = document.forms ["form"] ["newEmail"];
        var newEmail = document.getElementById("fillemail");
        xValidate(inbox, newEmail);
    }
    else
    {
        var inbox = document.forms ["form"] ["newEmail"];
        var newEmail = document.getElementById("fillemail");
        yValidate(inbox, newEmail);
    }
}

function validateConfEmail()
{
    var confeml = document.forms["form"] ["retypedNewEmail"].value;

    if (confeml==null || confeml=="" || confeml==" ")
    {
        var inbox = document.forms ["form"] ["retypedNewEmail"];
        var newEmail = document.getElementById("fillemailConf");
        xValidate(inbox, newEmail);
    }
    else
    {
        var inbox = document.forms ["form"] ["retypedNewEmail"];
        var newEmail = document.getElementById("fillemailconf");
        yValidate(inbox, newEmail);
    }

    var confirmEmail = document.forms["form"] ["newEmail"].value;

   if (document.forms["form"] ["retypedNewEmail"].value != document.forms["form"] ["newEmail"].value)
    {
        var inbox = document.forms ["form"] ["retypedNewEmail"];
        var newEmail = document.getElementById("fillemailConf");
        xValidate(inbox, newEmail);
    }
    else
    {
        var inbox = document.forms ["form"] ["retypedNewEmail"];
        var newEmail = document.getElementById("fillemailConf");
        yValidate(inbox, newEmail);
    }
}

我在Firefox和IE上尝试了您的代码,并向每个功能添加了警报。 当单击“注册”按钮时,在Firefox中,将显示所有警报,而在IE中,只会显示firstName警报。

原因:: xValidate和yValidate函数在IE中给出错误。

在行:: inbox.style.backgroundColor="rgba(255, 0, 0, .1)"; SCRIPT380:无效的属性值。

我建议,检查您的控制台是否有JS错误,它应该可以解决您的问题。

希望这可以帮助!

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM