提交正則表達式電子郵件驗證

我想通過正則表達式提交一個非常基本的jQuery電子郵件驗證。我的HTML：提交正則表達式電子郵件驗證

<form action="POST" id="form"> 
<input type="email" id="customer_email" placeholder="email here" /> 
<input type="submit" /> 
</form>

JS：

$('#form').submit(function() { 
var email_reg = /^([\w-\.][email protected]([\w-]+\.)+[\w-]{2,4})?$/; 

var emailinput = $('#customer_email').value(); 

if (email_reg.test(emailinput) == false) { 
    window.alert('no good'); 
} 
});

據我瞭解，這個工作我需要通過電子郵件輸入的輸入值（這是我第4行辦），並運行正則表達式。

單擊提交時，窗體上會顯示標準輸入錯誤，而不是窗口警報。隨意查看Codepen這裏概述如下： http://codepen.io/anon/pen/oYmJLW?editors=1010

來源

2016-12-19 kawnah

我使用這封電子郵件測試了你的正則表達式：「2039i#@gmail.com」，它工作得很好。它提醒你的警告信息（「不好」）。你試過什麼郵件？也許正則表達式必須改變你的情況。 –

我在我的個人網站上使用正則表達式，它效果很好。問題是我正在使用'type =「email」'，我想它覆蓋了JS驗證。 – kawnah

您需要添加event.preventDefault()防止實際表單提交，並在輸入使用.val()，而不是.value()。

$('#form').submit(function(event) { 
    event.preventDefault(); 
    var email_reg = /^([\w-\.][email protected]([\w-]+\.)+[\w-]{2,4})?$/; 

    var emailinput = $('#customer_email').val(); 

    if (email_reg.test(emailinput) == false) { 
     window.alert('no good'); 
    } 
});

通過聲明你的輸入作爲type="email"您的瀏覽器將執行有效性檢查（你不需要自己做的話），如果要規避使用type="text"。

來源

2016-12-19 21:12:29 chrki

哦，我明白了。所以如果你使用'type =「email」'瀏覽器進行有效性檢查並覆蓋JS？我不知道。不會'e.preventDefault（）;'不允許發生？ – kawnah

@kawnah'e.preventDefault（）'只是阻止提交。說實話，我不知道爲什麼Javascript被完全跳過，爲什麼它會這樣交互，我猜想怪異的瀏覽器怪癖 – chrki

提交正則表達式電子郵件驗證

回答

相關問題