求助，表单验证不能弹出alert信息

Question

初学javascript，学校作业要求做一个网上书店的下单表单，并验证用户输入内容（不可为空，银行卡号长度等）。写完代码以后发现点击submit时不会出现任何提示信息，表单自动刷新。但是另外一个搜索框的提示信息能正常弹出。求各位大手帮忙看下我的代码到底哪里出现了问题，感激不尽。以下是Javascript的Function代码：
function validate(Order){
var temp
var space

//Check Book tittle 
//empty
if (document.Order.Book.value=="Book Tittle"||document.Order.Book.value==""){
alert("Please enter the book tittle.")
return false
}
//including num
for (var i=0;i<document.Order.Book.value.length;i++){
temp=document.Order.Book.value.substring(i,i+1) 

if (digits.indexOf(temp)!=-1){ 
alert("There's no book with tittle including"+ temp +", please check again.") 
return false
}
}
//===================
//Check ISBN
//empty
if (document.Order.ISBN.value=="13-digits"||document.Order.ISBN.value==""){
alert("Please enter the ISBN number.")
return false
}
//including no-digits
for (var i=0;i<document.Order.ISBN.value.length;i++){
temp=document.Order.ISBN.value.substring(i,i+1) 

if (digits.indexOf(temp)==-1){ 
alert("There's no book with ISBN number including"+ temp +", please check again.") 
return false
}
}
//===================
//check name
//empty
if (document.Order.Name.value=="Please enter your name."||document.Order.Name.value==""){
alert("Please enter your name.")
return false
}
//include num
for (var i=0;i<document.Order.Name.value.length;i++){
temp=document.Order.Name.value.substring(i,i+1)

if (digits.indexOf(temp)!=-1){ 
alert("There's nobody name including "+ temp +", please check again.") 
return false
}
}

//at least 1 " "
space = value.indexOf(" ")
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}

//===================
//Address line
//line 1 empty
if (document.Order.Address1.value==""){
alert("Please enter the shipping address.")
return false
}
//===================
//state
//not "state"
temp = document.getElementById("SelectState")
if (temp.option.[index].value == State){
alert ("Please select the state.")
}
//===================
//postcode
//empty
if (document.Order.Postcode.value=="XXXX"||document.Order.Postcode.value==""){
alert("Please enter the postcode.")
return false
}
//length != 4 chars
if (document.Order.Postcode.value.length != 4){
alert("Postcode should be a 4-digits number. Please check again.")
return false
}
//including non-digits
for (var i=0;i<document.Order.Postcode.value.length;i++){
temp=document.Order.Postcode.value.substring(i,i+1)

if (digits.indexOf(temp)==-1){ 
alert("Postcode should not including"+ temp +", please check again.") 
return false
}
}
//===================
//CardID
//empty
if (document.Order.CardID.value==""){
alert("Please enter the Card ID.")
return false
}
//length
if (document.Order.Postcode.value.length != 16){
alert("Invalid Card ID. Please check again.")
return false
}
//no-digits
for (var i=0;i<document.Order.CardID.value.length;i++){
temp=document.Order.CardID.value.substring(i,i+1)

if (digits.indexOf(temp)==-1){ 
alert("Card ID should not including"+ temp +", please check again.") 
return false
}
}
//===================
//holder name
//empty
if (document.Order.Holder.value==""){
alert("Please enter the Card ID.")
return false
}
//including digits
for (var i=0;i<document.Order.Holder.value.length;i++){
temp=document.Order.Holder.value.substring(i,i+1)

if (digits.indexOf(temp)!=-1){ 
alert("Nobody name including "+ temp +", please check again.") 
return false
}
}
//at least 1 " "
space = value.indexOf(" ")
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}

//===================
//Expiry Date
//Month != MM
temp = document.getElementById("Month")
if (temp.option.[index].value == MM){
alert ("Please select the expiry month.")
}
//Year != YY
temp = document.getElementById("Year")
if (temp.option.[index].value == YY){
alert ("Please select the expiry year.")
}
//===================
//CVV
//empty
if (document.Order.CVV.value=="XXX"||document.Order.CVV.value==""){
alert("Please enter the CVV number.")
return false
}
//no-digits
for (var i=0;i<document.Order.CardID.value.length;i++){
temp=document.Order.CardID.value.substring(i,i+1)

if (digits.indexOf(temp)==-1){ 
alert("CVV number should not including"+ temp +", please check again.") 
return false
}
}
//Length != 3
if (document.Order.CVV.value.length != 3){
alert("CVV number should be a 3-digits number. Please check again")
return false
}
//Validation passed
return true
}以下是表单的代码：
<div id="PlaceOrder">
<form name="Order" onSubmit="validate(Order)">
 <p>
  Product details:<br><br>
 </p>
   <p>Book：
      <input type="text" class="text" name="Book" value="Book Tittle" >
      <br><br>
   </p>
   
    <p>ISBN：
      <input type="text" class="text" name="ISBN" value="13-digits" >
      <br><br>
   </p>
   
   <p>
  Shipping informations:<br><br>
 </p>
   
    <p>Name：
      <input type="text" class="text" name="Name" value="Please enter your name." >
      <br><br>
     </p>
     
    <p>Address line 1：
      <input type="text" class="text" name="Address1" >
      <br><br>
     </p>
     
    <p>Address Line 2：
      <input type="text" class="text" name="Address2" >
      <br><br>
    </p>
    
    <p>State：
<select name="State" id = "SelectState">
<option value="State" selected="selected">State</option>
<option value="ACT" >ACT</option>
<option value="NSW" >NSW</option>
<option value="NT" >NT</option>
<option value="QLD" >QLD</option>
<option value="SA" >SA</option>
<option value="TAS" >TAS</option>
<option value="VIC" >VIC</option>
<option value="WA" >WA</option>
</select>
      <br><br>
    </p>
    
    <p>Postcode：
      <input type="text" class="text" name="Postcode" value="XXXX" >
      <br><br>
    </p>
    
    <p>
     Payment Information:<br><br>
    </p>
    
    <p>Card ID：
      <input type="text" class="text" name="CardID" >
      <br><br>
    </p>
    
    <p>Card Holder name：
      <input type="text" class="text" name="Holder" >
      <br><br>
    </p>
    
    <p>Expiry Date：
<select name="Month" id="Month" >
<option value="MM" selected="selected">MM</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>
</select>
/
<select name="Year" id="Year">
<option value="YY" selected="selected">YY</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>
</select>
      <br><br>
    </p>
    
    <p>CVV：
      <input type="text" class="text" name="CVV" value="XXX" >
      <br><br>
    </p>
    
   <p>
     <br>
     <input type="submit" class="btn" value="Submit">             
     <input type="reset" class="btn" value="Reset">
    </p>
</form>
 </div>

Answer 1

代码就不看了，onSubmit这里没有返回值，就算验证出错也不会阻止表单提交
<form name="Order" onSubmit="validate(Order)">===><form name="Order" onSubmit="return validate(Order)">Web开发学习资料推荐
jquery全年日期选择器日历插件
javascript混淆加密

Answer 2

感谢指正，刚刚自己也发现了一个问题。但是修改以后还是只有第一个if语句，检验book tittle那里能成功的弹出错误信息。后面的无论是检验是否含有数字，还是其他的检验都还是直接刷新表单然后没有弹出信息。这是怎么回事啊？

Answer 3

感谢指正，刚刚自己也发现了一个问题。但是修改以后还是只有第一个if语句，检验book tittle那里能成功的弹出错误信息。后面的无论是检验是否含有数字，还是其他的检验都还是直接刷新表单然后没有弹出信息。这是怎么回事啊？ if (temp.option.[index].value == YY){
            alert ("Please select the expiry year.")
        }
这里也错了啊。。temp.options，不是option，而且options后不需要点。你这个是语法错误，整个js代码块都无法解析了，有多处这个错误，自己修正来
<form name="Order" onSubmit="return validate(Order)">
Order变量你也没用定义吧。。digits变量也是，判断是否数字用正则就行了。document.Order这个表单你不知道用个变量存储下，每次都访问一次不是增加代码量。。你这个代码真实又丑又长    function validate(Order){
        var temp
        var space
        var f = document.Order
        //Check Book tittle 
        //empty
        if (f.Book.value=="Book Tittle"||f.Book.value==""){
            alert("Please enter the book tittle.")
            return false
        }
        var reNum = /\d/        //including num
        if (reNum.test(f.Book.value)) {
            alert("There's no book with tittle including" + temp + ", please check again.")
            return false
        }
        //===================
        //Check ISBN
        //empty
        if (f.ISBN.value=="13-digits"||f.ISBN.value==""){
            alert("Please enter the ISBN number.")
            return false
        }
        //including no-digits
        if (!/^\d{13}$/.test(f.ISBN.value)) {
            alert("There's no book with ISBN number including" + temp + ", please check again.")
            return false
        }
        //===================
        //check name
        //empty
        if (f.Name.value=="Please enter your name."||f.Name.value==""){
            alert("Please enter your name.")
            return false
        }
        //include num
        if (reNum.test(f.Name.value)) {
            alert("There's nobody name including " + temp + ", please check again.")
            return false
        }自己按照上面的格式改下，特别正则部分

Answer 4

感谢指正，刚刚自己也发现了一个问题。但是修改以后还是只有第一个if语句，检验book tittle那里能成功的弹出错误信息。后面的无论是检验是否含有数字，还是其他的检验都还是直接刷新表单然后没有弹出信息。这是怎么回事啊？ if (temp.option.[index].value == YY){
            alert ("Please select the expiry year.")
        }
这里也错了啊。。temp.options，不是option，而且options后不需要点。你这个是语法错误，整个js代码块都无法解析了，有多处这个错误，自己修正来
<form name="Order" onSubmit="return validate(Order)">
Order变量你也没用定义吧。。digits变量也是，判断是否数字用正则就行了。document.Order这个表单你不知道用个变量存储下，每次都访问一次不是增加代码量。。你这个代码真实又丑又长    function validate(Order){
        var temp
        var space
        var f = document.Order
        //Check Book tittle 
        //empty
        if (f.Book.value=="Book Tittle"||f.Book.value==""){
            alert("Please enter the book tittle.")
            return false
        }
        var reNum = /\d/        //including num
        if (reNum.test(f.Book.value)) {
            alert("There's no book with tittle including" + temp + ", please check again.")
            return false
        }
        //===================
        //Check ISBN
        //empty
        if (f.ISBN.value=="13-digits"||f.ISBN.value==""){
            alert("Please enter the ISBN number.")
            return false
        }
        //including no-digits
        if (!/^\d{13}$/.test(f.ISBN.value)) {
            alert("There's no book with ISBN number including" + temp + ", please check again.")
            return false
        }
        //===================
        //check name
        //empty
        if (f.Name.value=="Please enter your name."||f.Name.value==""){
            alert("Please enter your name.")
            return false
        }
        //include num
        if (reNum.test(f.Name.value)) {
            alert("There's nobody name including " + temp + ", please check again.")
            return false
        }自己按照上面的格式改下，特别正则部分感谢帮助。按你的方法修改之后代码简化了不少。但是我修改了之后问题依然存在，依然只有第一个if语句可以弹出alert消息感觉很无奈

Answer 5

<script type="text/javascript">
 
 function validate(Order){
var temp,
 space,
 fOder=document.Order,
 digits=/\d/;
 
//Check Book tittle 
//empty
if (fOder.Book.value=="Book Tittle"||fOder.Book.value==""){
alert("Please enter the book tittle.")
return false
}
//including num
if (!digits.test(fOder.Book.value)){ 
alert("There's no book with tittle including"+ temp +", please check again.") 
return false
}//===================
//Check ISBN
//empty
if (fOder.ISBN.value=="13-digits"||fOder.ISBN.value==""){
alert("Please enter the ISBN number.")
return false
}
//including no-digits
alert(digits.test(fOder.ISBN.value));
if (digits.test(temp)){ 
alert("There's no book with ISBN number including"+ temp +", please check again.") 
return false
}//===================
//check name
//empty
if (fOder.Name.value=="Please enter your name."||fOder.Name.value==""){
alert("Please enter your name.")
return false
}
//include num
if (!digits.test(fOder.Name.value)){ 
alert("There's nobody name including "+ temp +", please check again.") 
return false
}
//at least 1 " "space =fOder.Name.value.indexOf(" ")
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}//===================
//Address line
//line 1 empty
if (fOder.Address1.value==""){
alert("Please enter the shipping address.")
return false
}
//===================
//state
//not "state"
temp = document.getElementById("SelectState")
if (temp.options.value == "State"){
alert ("Please select the state.")
}
//===================
//postcode
//empty
if (fOder.Postcode.value=="XXXX"||fOder.Postcode.value==""){
alert("Please enter the postcode.")
return false
}
//length != 4 chars
if (fOder.Postcode.value.length != 4){
alert("Postcode should be a 4-digits number. Please check again.")
return false
}
//including non-digits
if (digits.test(fOder.Postcode.value)){ 
alert("Postcode should not including"+ temp +", please check again.") 
return false
}//===================
//CardID
//empty
if (fOder.CardID.value==""){
alert("Please enter the Card ID.")
return false
}
//length
if (fOder.CardID.value.length != 16){
alert("Invalid Card ID. Please check again.")
return false
}
//no-digits
if (digits.test(fOder.CardID.value)){ 
alert("Card ID should not including"+ temp +", please check again.") 
return false
}//===================
//holder name
//empty
if (fOder.Holder.value==""){
alert("Please enter the Card ID.")
return false
}
//including digits
if (!digits.test(fOder.Holder.value)){ 
alert("Nobody name including "+ temp +", please check again.") 
return false
}//at least 1 " "
space =fOder.Holder.value.indexOf(" ");
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}//===================
//Expiry Date
//Month != MM
temp = document.getElementById("Month")
alert(temp.options.value);
if (temp.options.value == "MM"){
alert ("Please select the expiry month.")
}
//Year != YY
temp = document.getElementById("Year")
alert(temp.options.value);
if (temp.options.value == "YY"){
alert ("Please select the expiry year.")
}
//===================
//CVV
//empty
if (fOder.CVV.value=="XXX"||fOder.CVV.value==""){
alert("Please enter the CVV number.")
return false
}
//no-digits
if (digits.test(fOder.CVV.value)){ 
alert("CVV number should not including"+ temp +", please check again.") 
return false
}//Length != 3
if (fOder.CVV.value.length != 3){
alert("CVV number should be a 3-digits number. Please check again")
return false
}
//Validation passed
return true
}
 </script>

Answer 6

<script type="text/javascript">
 
 function validate(Order){
var temp,
 space,
 fOder=document.Order,
 digits=/\d/;
 
//Check Book tittle 
//empty
if (fOder.Book.value=="Book Tittle"||fOder.Book.value==""){
alert("Please enter the book tittle.")
return false
}
//including num if (!digits.test(fOder.Book.value)){ 
alert("There's no book with tittle including"+ temp +", please check again.") 
return false
}//===================
//Check ISBN
//empty
if (fOder.ISBN.value=="13-digits"||fOder.ISBN.value==""){
alert("Please enter the ISBN number.")
return false
}
//including no-digitsif (digits.test(temp)){ 
alert("There's no book with ISBN number including"+ temp +", please check again.") 
return false
}//===================
//check name
//empty
if (fOder.Name.value=="Please enter your name."||fOder.Name.value==""){
alert("Please enter your name.")
return false
}
//include numif (!digits.test(fOder.Name.value)){ 
alert("There's nobody name including "+ temp +", please check again.") 
return false
}//at least 1 " "space =fOder.Name.value.indexOf(" ")
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}//===================
//Address line
//line 1 empty
if (fOder.Address1.value==""){
alert("Please enter the shipping address.")
return false
}
//===================
//state
//not "state"
temp = document.getElementById("SelectState")
  
for(i=0;i<temp.options.length;i++){

if (temp.options[i].selected&&temp.options[i].value=="State"){
 
alert ("Please select the state.")
return false
}
}
//===================
//postcode
//empty
if (fOder.Postcode.value=="XXXX"||fOder.Postcode.value==""){
alert("Please enter the postcode.")
return false
}
//length != 4 chars
if (fOder.Postcode.value.length != 4){
alert("Postcode should be a 4-digits number. Please check again.")
return false
}
//including non-digitsif (digits.test(fOder.Postcode.value)){ 
alert("Postcode should not including"+ temp +", please check again.") 
return false
}//===================
//CardID
//empty
if (fOder.CardID.value==""){
alert("Please enter the Card ID.")
return false
}
//length
if (fOder.CardID.value.length != 16){
alert("Invalid Card ID. Please check again.")
return false
}
//no-digits
if (digits.test(fOder.CardID.value)){ 
alert("Card ID should not including"+ temp +", please check again.") 
return false
}//===================
//holder name
//empty
if (fOder.Holder.value==""){
alert("Please enter the Card ID.")
return false
}
//including digitsif (!digits.test(fOder.Holder.value)){ 
alert("Nobody name including "+ temp +", please check again.") 
return false
}//at least 1 " "
space =fOder.Holder.value.indexOf(" ");
if (space == -1 ){
alert("Your name must including at least one space. Did your forgot your first name or last name?")
return false
}
//===================
//Expiry Date
//Month != MM
temp = document.getElementById("Month")
for(i=0;i<temp.options.length;i++){

if (temp.options[i].selected&&temp.options[i].value=="MM"){
   
   alert ("Please select the expiry month.")
return false
}
}
//Year != YY
temp = document.getElementById("Year")
for(i=0;i<temp.options.length;i++){

if (temp.options[i].selected&&temp.options[i].value=="YY"){   alert ("Please select the expiry year.")
return false
}
}
//===================
//CVV
//empty
if (fOder.CVV.value=="XXX"||fOder.CVV.value==""){
alert("Please enter the CVV number.")
return false
}
//no-digits
if (digits.test(fOder.CVV.value)){ 
alert("CVV number should not including"+ temp +", please check again.") 
return false
}
//Length != 3
if (fOder.CVV.value.length != 3){
alert("CVV number should be a 3-digits number. Please check again")
return false
}
//Validation passed
return true
}
</script>

Answer 7

不好意思，我第一次发的有问题，已发贴上改不了，元素数组options.value不对的，要用for(){}循环语句去取得options数组每一个元素值去做判断，请看第二次发的