驗證不會工作。它不會顯示錯誤消息。有什麼可能是錯的？

我有以下代碼：驗證不會工作。它不會顯示錯誤消息。有什麼可能是錯的？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>Registration</title> 
     <script type="text/javascript" src="lib/jquery/jquery-1.4.2.js"></script> 
     <script type="text/javascript" src="/dateplugin.js"></script> 
     <link rel="stylesheet" type="text/css" href="/stylez.css"/> 
     <script type="text/jscript"> 
     $(document).ready(function(){ 
     //$.dateSelectBoxes('mon','da','yea'); 
     //form validation 
    var hasError = false; 
    var emailReg = /^([w-.][email protected]([w-]+.)+[w-]{2,4})?$/; 
    var email = $("#em").val(); 
    var fname=$("#fn").val(); 
    var lname=$("#ln").val(); 
    var school=$("#sch").val(); 
    var classes=$("#clas").val(); 
    var grade=$("#yr").val(); 
    var month=$("#mon").val(); 
    var days=$("#da").val(); 
    var years=$("#yea").val(); 
    var pass=$("#pas").val(); 
    var zipcode=$("#zip").val(); 

    $("#submitbutton").click(function(e){ 
    if (fname==''){ 
     $("#fn").after("Please enter your first name "); 
     hasError=true; 
    } 

    if (lname==''){ 
     $("#ln").after("Please enter your last name"); 
     hasError=true; 
    } 

     if(school==''){ 
     $("#sch").after("Please enter the name of your institution"); 
     hasError=true; 
     } 

     if (classes==''){ 
     $("#clas").after("Please enter current classes you are taking"); 
     hasError=true; 
     } 

     if (month=='' || day=='' || year==''){ 
     $("#mon").after("Please enter your birthday"); 
     hasError=true; 
     } 

     if (pass==''){ 
     $("#pas").after("Please enter the password"); 
     hasError=true; 
     } 

     if (zipcode==''){ 
     $("#zip").after("Please enter your zipcode"); 
     hasError=true; 
     } 

     if (grade==''){ 
     $("#yr").after("Please enter the year you are in"); 
     hasError=true; 
     } 

     if(email == '') { 
     $("#em").after("You forgot to enter the email address to send "); 
      hasError = true; 
     } else if(!emailReg.test(email)) { 
      $("#em").after("Enter a valid email address to send to."); 
      hasError = true; 
     } 

     if (hasError == true) { 

      e.preventDefault(); 
    } 
    else{ 
     //submit form via ajax 
    } 
    }); 


     }); 
     </script> 

     <style type="text/css"> 



     </style> 
    </head> 
    <body class="fancy"> 
     <form action="" method="" accept-charset="utf-8"> 
     <table width="800" border="0" cellpadding="1" cellspacing="0" > 
     <tr> 
     <td id="column1"> 
     </td> 
     <td id="column2"> 
      <div class="Sintext"><h1>Sign Up</h1></div> 
      <div> 
     <label>First Name</label> 
     <input type="text" name="fnam" class="fields" id="fn" /> 
     </div> 
     <div> 
     <label>Last Name</label> 
     <input type="text" name="lnam" class="fields" id="ln"/> 
     </div> 
     <div > 
     <label>School</label> 
     <input type="text" name="scname" class="fields" id="sch"/> 
      </div> 
      <div> 
     <label>Major</label> 
     <select id="majo" name="major"> 
      <option value="5">&mdash;undeclared&mdash;</option> 
     </select> 
     </div> 
     <div> 
      <label>Current Classes</label> 
      <input type="text" name="class" id="clas" class="fields"/> 
      <span>add class field</span> 
      </div> 
     <div> 
      <label>Year</label> 
      <select id="yr" name="year"> 
       <option value="">&mdash;Select the year &mdash;</option> 
       <option value="10">Freshman </option> 
       <option value="20">Sophomore</option> 
       <option value="30">junior</option> 
       <option value="40">senior</option> 
       <option value="50">Alumni </option> 
       <option value="60">HighSchool </option> 
       </select> 
     </div> 
     <div > 
      <label>Campus</label> 
      <input type="text" name="campus" class="fields" /> 
     </div> 
     <div > 
      <label>Email</label> 
      <input type="text" name="email" id="em" class="fields"/> 
     </div> 
     <div > 
      <label>Password</label> 
      <input type="text" name="passwd" id="pas" class="fields"/> 
     </div> 
     <div > 
      <label>Sex</label> 
    <select name="sex" class="sexfield"> 
     <option value="3">Male</option> 
     <option value="4">Female </option> 
    </select> 
     </div> 
     <div id="bdate"> 
      <label>Birthday</label> 
      <select id="mon" name="mont"> 
       <option value="0">Month</option> 
       </select> 
      <select id="da" name="day"> 
       <option value="1">Day</option> 
       </select> 
      <select id="yea" name="year"> 
       <option value="2">Year</option> 
       </select> 
      </div> 
     <div >  
      <label>Zipcode</label> 
      <input type="text" name="zipcod" id="zip" class="zipfield"/> 
     </div> 
     <div > 
      <button id="submitbutton" class="sinbutton">Sign Up</button> 
     </div> 
     </td> 
     </tr> 
    </table> 



     </form> 
    </body> 
    </html>

來源

2011-03-08 Djm

嗯，首先：

<div "> <--- Invalid Markup 
     <label>Password</label> 
     <input type="text" name="passwd" id="pas" class="fields"/> 
    </div> 

<table width="800" border="0" cellpadding="1" cellspacing="0" /> <--- self closing Table......

您的電子郵件正則表達式是無效的。

而在去年：變化：

$("#sign").click(function(e) { 
})

到：

$("#submitbutton").click(function(e) { 
});

和

<button type="submit" id="submitbutton" class="sinbutton">Sign Up</button>

到

<button id="submitbutton" class="sinbutton">Sign Up</button>

和

if (hasError == true) { 
     return false; 
    } 
    else { 
     //submit form via ajax 
    }

到

if (hasError == true) { 
     e.preventDefault(); 
    } 
    else { 
     //submit form via ajax 
    }

UPDATE

你的正則表達式仍然無效！取消註釋正則表達式，以及檢查它的代碼現在將其排除在外。

你聲明：

var days=$("#da").val();

但後來你試圖訪問一個不存在的變量「天」。

同樣的事情在這裏：var years=$("#yea").val();但訪問變量年：

if (month=='' || day=='' || year==''){

第一：你需要學習如何使用Firebug（火狐），開發工具（IE）或Chrome的檢查，因爲javascript錯誤顯示在那裏。

第二個：你應該學會如何正確地設置你的問題。我必須現在編輯你的問題兩次，清理它。

第三：在發佈有關HTML/Javascript/CSS的問題時，應該使用jsfiddle.net來演示您的代碼。看看這個：

http://jsfiddle.net/yngvebn/FdunX/

來源

2011-03-08 13:08:33

代碼謝謝你們！我已經改變了代碼，就像你說的，但仍是（）後不會顯示錯誤message.look在上面的代碼的代碼。 – Djm 2011-03-08 22:39:27

在我的答案中查看我的更新。 – 2011-03-09 07:59:54

，因爲你有形式的，當你點擊按鈕的形式提交提交按鈕。改變這樣的

 
$("#sign").click(function(e){ 
    e.preventDefault(); 
    . 
    . 
    .

來源

2011-03-08 13:09:42 Fatih

驗證不會工作。它不會顯示錯誤消息。有什麼可能是錯的？

回答

相關問題