$('#submit').click(function() { $(".error").hide(); $("label").removeClass('red'); var hasError = false; var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; var name = $('#name').val(); var message = $('#message').val(); var emailaddressVal = $("#email").val(); if(emailaddressVal == '') { $("#email").after('<small class="error small">Please enter your email address</small>'); $("label[for=email]").addClass('red'); hasError = true; } if(!emailReg.test(emailaddressVal)) { $("#email").after('<small class="error">Enter a valid email address</small>'); $("label[for=email]").addClass('red'); hasError = true; } if(hasError == true) { return false; } });
<form > <label for="email">Email:</label> <input type="text" name="email" id="email"> <input type="submit" id="submit"/> </form>
body {font-family: sans-serif;} .red { color:red } .error { color: red; display:block;} input {display:block; margin: 5px 0}