Using regular expressions is probably the best way. You can see a few tests here (removed from chromium ) p>
function validarEmail(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(String(email).toLowerCase());
}
Here are some examples of regular expressions that accept unicode:
var re = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
But bear in mind that one should not rely solely on JavaScript validation. JavaScript can be easily disabled. This should be validated on the server side as well.
Here's an example of this in action:
function validarEmail(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);
}
function validar() {
var $result = $("#result");
var email = $("#email").val();
$result.text("");
if (validarEmail(email)) {
$result.text(email + " é válido :)");
$result.css("color", "green");
} else {
$result.text(email + " não é válido :(");
$result.css("color", "red");
}
return false;
}
$("#validar").bind("click", validar);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<p>Introduz o seu endereço eletrónico:</p>
<input id='email'>
<button type='submit' id='validar'>Validar!</button>
</form>
<h2 id='result'></h2>