日期选择选项不验证onsubmit

Question

首先，我是新来的Javascript和HTML。

我在验证模式弹出式查询表单中的必填字段时遇到问题。提交表单时，我设法实现了enquiryFormValidation javascript函数。但由于某些原因，在功能细节div中，日下拉选择框未验证。

您的想法和建议，欢迎....

这里的JavaScript的：

// Enquiry Form Validation 

function enquiryFormValidation() { 

// Setting Variables 

var errormessage = ""; 

var ufirstname = document.getElementById("firstname"); 
var usurname = document.getElementById("surname"); 
var uaddress = document.getElementById("address"); 
var upostcode = document.getElementById("postcode"); 
var utel = document.getElementById("tel"); 
var uemail = document.getElementById("email"); 
var uhearabout = document.getElementById("where"); 
var fday = document.getElementById("fday"); 
var fmonth = document.getElementById("month"); 
var fyear = document.getElementById("year"); 
var vname = document.getElementById("vname"); 
var vaddress = document.getElementById("vaddress"); 
var vpostcode = document.getElementById("vpostcode"); 
var ftype = document.getElementById("ftype"); 
var noattend = document.getElementById("noattend"); 
var arrive = document.getElementById("arrive"); 
var garrival = document.getElementById("garrival"); 
var fend = document.getElementById("fend"); 
var addinfo = document.getElementById("additional-info-textarea"); 


// Form submit required fields validation 



if (ufirstname.value == "(e.g. John)") { 
    errormessage += "Please enter your Firstname.\n"; 
    ufirstname.style.border = "1px solid red" ; 

} 

if (usurname.value == "(e.g. Smith)") { 
    errormessage += "Please enter your Surname.\n"; 
    usurname.style.border = "1px solid red" ; 

} 

if (uaddress.value == "(e.g. 101 Glimmer Street)") { 
    errormessage += "Please enter your Address.\n"; 
    uaddress.style.border = "1px solid red" ; 

} 

if (upostcode.value == "(e.g. TF1 7HU)") { 
    errormessage += "Please enter your Postcode.\n"; 
    upostcode.style.border = "1px solid red" ; 

} 

if (uemail.value == "(e.g. info@glimmer-nights.co.uk)") { 
    errormessage += "Please enter your Email.\n"; 
    uemail.style.border = "1px solid red" ; 

} 

if (uhearabout.value == "blank") { 
    errormessage += "Please select where you heard about us.\n"; 
    uhearabout.style.border = "1px solid red" ; 

} 

if (fday.value == "blank") { 
    errormessage += "Please select a Function Day.\n"; 
    fday.style.border = "1px solid red" ; 

} 


if (fmonth.value == "blank") { 
    errormessage += "Please select Function Month.\n"; 
    fmonth.style.border = "1px solid red" ; 

} 

if (fyear.value == "blank") { 
    errormessage += "Please select Function Year.\n"; 
    fyear.style.border = "1px solid red" ; 

} 

if (ftype.value == "blank") { 
    errormessage += "Please select a Function Type.\n"; 
    ftype.style.border = "1px solid red" ; 

} 


if (garrival.value == "hh:mm") { 
    errormessage += "Please select Guest Arrival time.\n"; 
    garrival.style.border = "1px solid red" ; 

} 


if (fend.value == "hh:mm") { 
    errormessage += "Please select Function End time.\n"; 
    fend.style.border = "1px solid red" ; 

} 



if (errormessage != "") { 
    alert (errormessage); 
    return false; 

} 



} // End of enquiryForm-validation function 

而这里的HTML：

     <label for="fdate">*Date:</label> 
        <select size="1" name="fdetail" id="fday" class="input" tabindex="8" /> 
             <option vaule="blank">Day</option> 
             <option value="01">01</option> 
             <option value="02">02</option> 
             <option value="03">03</option> 
             <option value="04">04</option> 
             <option value="05">05</option> 
             <option value="06">06</option> 
             <option value="07">07</option> 
             <option value="08">08</option> 
             <option value="09">09</option> 
             <option value="10">10</option> 
             <option value="11">11</option> 
             <option value="12">12</option> 
             <option value="13">13</option> 
             <option value="14">14</option> 
             <option value="15">15</option> 
             <option value="16">16</option> 
             <option value="17">17</option> 
             <option value="18">18</option> 
             <option value="19">19</option> 
             <option value="20">20</option> 
             <option value="21">21</option> 
             <option value="22">22</option> 
             <option value="23">23</option> 
             <option value="24">24</option> 
             <option value="25">25</option> 
             <option value="26">26</option> 
             <option value="27">27</option> 
             <option value="28">28</option> 
             <option value="29">29</option> 
             <option value="30">30</option> 
             <option value="31">31</option> 
            </select> 

Answer 1

你需要做的是这样的

if (fday.options[fday.selectedIndex].value == "blank") { 
    errormessage += "Please select a Function Day.\n"; 
    fday.style.border = "1px solid red" ; 
} 

更正你的html中的错字。

<option vaule="blank">Day</option> 

应该是：

<option value="blank">Day</option> 

此外， jQuery