Email validation

This code sample will allow you to validate an email in real time, as the user types. The email field will have a red border until a valid email is provided.

HTML
<input type="email" onkeyup="checkEmail(this)" placeholder="Your email" />

JavaScript
function checkEmail(el) {
    var val = el.value;
    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,}))$/;
    if (!re.test(val)) {
    	el.style.border="2px solid red";
        el.focus();
        return false;
    }
    el.style.border="0px";
    return true;
}

Directions:
- add the onkeyup event handler

Note:
This snippet focuses on iOS development. Make sure to verify/adapt any vendor prefixes. Back to main listing.

Back to Blog