簡體   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