JavaScript的電子郵件驗證，而不提交

Question

我要驗證此電子郵件：

<div> 
    <div> 

     <div > 
      <big><p>please enter an email address IF you wish to 
      recieve a link to your results.<p> 
      E-mail Address:</big> <input name="recipient"class="upload" type="text" 
      /> 
     <div id="correct"> 
      &#10004; 
     </div> 
     <div id="incorrect"> 
      &#10008; 
     </div> 
    </div> 
</div> 

我要檢查郵件是否輸入是有效的，如果它是有效的節目「正確的」分區，如果沒有顯示「不正確「div，我想在不提交表單的情況下做到這一點。

不能幫助嗎？謝謝

Answer 1

這是一個使用Regex來匹配值的函數。

<script language="javascript"> 
    function checkEmail() { 
    var email = document.getElementById('recipient'); 
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 
    if (!filter.test(email.value)) { 
    alert('Please provide a valid email address'); 
    email.focus; 
    return false; 
    document.getElementById('incorrect').style.visibility="visible"; 
    document.getElementById('correct').style.visibility="hidden"; 
    } 
    else 
    { 
    document.getElementById('correct').style.visibility="visible"; 
    document.getElementById('incorrect').style.visibility="hidden"; 
    } 
    } 
    </script> 

Answer 2

基於幾個JS框架的客戶端驗證的幾種選擇/插件/解決方案可用。我引用的只是一個利用jQuery的例子：http://speckyboy.com/2009/12/17/10-useful-jquery-form-validation-techniques-and-tutorials-2/

Answer 3

From this answer

function validateEmail(email) { 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\ ".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
    return re.test(email); 
}