Php Javascript表单验证不起作用?

Php Javascript表单验证不起作用?,php,javascript,forms,validation,Php,Javascript,Forms,Validation,我这辈子都搞不懂。一旦我找到countrySelect id,表单验证就会停止工作。即使我填写了此项,并试图让它显示zip或电话字段的警报,但它不起作用,它仍会继续提交表单。但是,当countrySelect id之前的输入为空时,警报工作。我不太明白 表格如下: <form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="post" name="addAffiliate" id="addAffiliate" onsubm

我这辈子都搞不懂。一旦我找到countrySelect id,表单验证就会停止工作。即使我填写了此项,并试图让它显示zip或电话字段的警报,但它不起作用,它仍会继续提交表单。但是,当countrySelect id之前的输入为空时,警报工作。我不太明白

表格如下:

<form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="post" name="addAffiliate" id="addAffiliate" onsubmit="return ValidateApplication()">
            <div id="affiliatesignup">
              <ul>
                <li>
                  <label>First Name</label>
                  <input type="text" name="firstname" id="firstname" value="<?php echo $firstname ;?>" />
                </li>
                <li>
                  <label>Last Name</label>
                  <input type="text" name="lastname" id="lastname"  value="<?php echo $lastname ;?>" />
                </li>
                 <li>
                  <label>Username</label>
                  <input type="text" name="username" id="username"  value="<?php echo $username ;?>" /> 
                  <label> </label>
                  <div style="margin-left:130px;font-size:11px;">(Note: Your username will appear in all your affiliate links, so choose wisely!)</div>
                </li>
                <li>
                  <label>Email</label>
                  <input type="text" name="email" id="email"  value="<?php echo $email ;?>" />
                </li>
                <li>
                  <label>Password</label>
                  <input  type="password" size="30" name="password" id="password" value="<?php echo $password ;?>"/>
                </li>
                <li>
                  <label>Confirm Password</label>
                  <input type="password" size="30" name="passwordc" id="passwordc" value="<?php echo $passwordc ;?>"/>
                </li>
                <div class="form-break"></div>
                <li>
                  <label>Mailing Address</label>
                  <input type="text" name="address" id="address"  value="<?php echo $address ;?>" />
                </li>
                <li>
                  <label>City</label>
                  <input type="text" name="city" id="city"  value="<?php echo $city ;?>" />
                </li>
                <li>
                  <label>Country</label>
                  <select id='countrySelect' name='countrySelect' onchange='populateState()'>
                  </select>
                </li>
                 <li>
                  <label>State/Province</label>
                  <select id='stateSelect' name='stateSelect'>
                  </select>
                  <script type="text/javascript">initCountry('US'); </script>
                </li>
                <li>
                  <label>Zip/Postal Code</label>
                  <input type="text" name="zip" id="zip"  value="<?php echo $zip ;?>" />
                </li>
                <li>
                  <label>Phone Number</label>
                  <input type="text" name="phone" id="phone"  value="<?php echo $phone ;?>" />
                </li>
                <div class="form-break"></div>
                <li>
                  <label>Payment Type</label>
                  <select name="payment_type" id="payment_type" onChange="paymentfunction(this.value);">
                    <option value="">Select Payment Type</option>
                    <option value="check">Check</option>
                    <option value="paypal">Paypal</option>
                  </select>
                </li>
                <li id="check-payable-to" style="display:none;">
                  <label>Check Payable To</label>
                  <input type="text" name="check_payable_to" id="check_payable_to"  value="<?php echo $check_payable_to ;?>" />
                </li>
                <li id="paypal-email" style="display:none;">
                  <label>Paypal Email</label>
                  <input type="text" name="paypal" id="paypal"  value="<?php echo $paypal ;?>" />
                </li>
                <div class="form-break"></div>
                <li>
                  <label>Website</label>
                  <input type="text" name="website" id="website"  value="<?php echo $website ;?>" />
                </li>
                <li>
                  <label>How do you plan to promote us?</label>
                  <textarea rows="4" name="promotion" id="promotion" type="text"><?php echo $promotion ;?></textarea>
                </li>
              </ul>
              <input type="hidden" value="<?php echo $affiliate ; ?>" name="affiliate" id="affiliate" />
              <input type="submit" value="Register" class="button-glossy green" id="bCreateAccount" tabindex="4" />
            </div>
          </form>
以下是页面标题中包含的javascript函数:

<script type="text/javascript">

    function ValidateApplication() {

            firstname = document.getElementById("firstname");
            lastname = document.getElementById("lastname");
            username = document.getElementById("username");
            email = document.getElementById("email");
            password = document.getElementById("password");
            passwordc = document.getElementById("passwordc");
            address = document.getElementById("address");
            city = document.getElementById("city");
            country = document.getElementById("countrySelect");
            state = document.getElementById("stateSelect");
            zip = document.getElementById("zip");
            phone = document.getElementById("phone");
            payment_type = document.getElementById("payment_type");
            check_payable_to = document.getElementById("check_payable_to");
            paypal = document.getElementById("paypal");
            website = document.getElementById("website");
            promotion = document.getElementById("promotion");

            if (firstname.value.length == 0) {
                alert("You must enter your first name");
                firstname.style.border = '1px solid #fa0404';
                firstname.focus();
                return false;   
            }
            if (lastname.value.length == 0) {
                alert("You must enter your last name");
                lastname.style.border = '1px solid #fa0404';
                lastname.focus();
                return false;   
            }
            if (username.value.length == 0) {
                alert("You must enter a user name");
                username.style.border = '1px solid #fa0404';
                username.focus();
                return false;   
            }
            if (email.value.length == 0) {
                alert("You must enter your email address");
                email.style.border = '1px solid #fa0404';
                email.focus();
                return false;   
            }
            if (password.value.length == 0) {
                alert("You must enter a password");
                password.style.border = '1px solid #fa0404';
                password.focus();
                return false;   
            }
            if (passwordc.value.length == 0) {
                alert("You must confirm your password");
                passwordc.style.border = '1px solid #fa0404';
                passwordc.focus();
                return false;   
            }
            if (password.value != passwordc.value) {
                alert("You passwords must match");
                password.style.border = '1px solid #fa0404';
                passwordc.style.border = '1px solid #fa0404';
                password.focus();
                return false;   
            }
            if (address.value.length == 0) {
                alert("You must enter your mailing address");
                address.style.border = '1px solid #fa0404';
                address.focus();
                return false;   
            }
            if (city.value.length == 0) {
                alert("You must enter your city");
                city.style.border = '1px solid #fa0404';
                city.focus();
                return false;   
            }
            if (countrySelect.value.length == 0) {
                alert("You must enter your country");
                countrySelect.style.border = '1px solid #fa0404';
                countrySelect.focus();
                return false;   
            }
            if (stateSelect.value.length == 0) {
                alert("You must enter your state/province");
                stateSelect.style.border = '1px solid #fa0404';
                stateSelect.focus();
                return false;   
            }
            if (zip.value.length == 0) {
                alert("You must enter your zip/postal code");
                zip.style.border = '1px solid #fa0404';
                zip.focus();
                return false;   
            }
            if (phone.value.length == 0) {
                alert("You must enter your phone number");
                phone.style.border = '1px solid #fa0404';
                phone.focus();
                return false;   
            }
            if (payment_type.value.length == 0) {
                alert("You must select your payment type");
                payment_type.style.border = '1px solid #fa0404';
                payment_type.focus();
                return false;   
            }
            if (payment_type.value == 'check') {
                if (check_payable_to.value.length == 0) {
                    alert("You must enter the name your check is payable to");
                    check_payable_to.style.border = '1px solid #fa0404';
                    check_payable_to.focus();
                    return false;   
                }   
            }
            if (payment_type.value == 'paypal') {
                if (paypal.value.length == 0) {
                    alert("You must enter paypal email address");
                    paypal.style.border = '1px solid #fa0404';
                    paypal.focus();
                    return false;   
                }   
            }
            if (website.value.length == 0) {
                alert("You must enter your website address");
                website.style.border = '1px solid #fa0404';
                website.focus();
                return false;   
            }
            if (promotion.value.length == 0) {
                alert("You must enter your promotional plans");
                promotion.style.border = '1px solid #fa0404';
                promotion.focus();
                return false;   
            }

    }
    </script>
您已经定义了country=document.getElementByIdcountrySelect;。按国家/地区替换对countrySelect的引用。stateSelect也是如此


还有。。在每个变量之前添加var,例如:var country=..

您的if语句引用了不存在的变量countrySelect。您创建了变量country以将DOM包含到该选择框中。因此,将代码从

if(countrySelect.value.length==0){
    ...
}

罗布是对的,而且:

DOM Select对象没有值属性,请参见:

如果您想知道是否在选择下拉列表中选择了任何内容,则需要检查.selectedIndex属性的值>=0。 例如:

       if (country.selectedIndex < 0) {
            alert("You must enter your country");
            country.style.border = '1px solid #fa0404';
            country.focus();
            return false;   
        }

尝试alertcountrySelect.value-显示什么?请包括您的populateState、initCountry和paymentfunction函数。若要将var添加到多个变量,请将var添加到第一个变量,用逗号分隔其他变量,最后一个变量留有分号。变量a=1,b=2,c=3;将来,在发布这样的问题之前,请确保检查错误控制台CTRL+SHIFT+J。我是个白痴。谢谢大家的帮助。添加var似乎解决了所有问题。
       if (country.selectedIndex < 0) {
            alert("You must enter your country");
            country.style.border = '1px solid #fa0404';
            country.focus();
            return false;   
        }