Validação de formulário com jQuery

Este é um exemplo simples para validar formulário do lado do cliente utilizando jQuery.



Formulário em html e código jQuery

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Validando formulário com JQuery</title>
<script src="jquery-1.4.2.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript"> 
	
	$(document).ready(function(){
		  $('#formcontato').submit(function(){
		    var msg = "";

	            if($('#nome').val() == ''){
	            	msg +='\nPreencha o campo nome';
	            		            	
	            }
				
                    //Verifica se o e-mail é um e-mail valido
	            var regmail = /^[\w!#$%&amp;'*+\/=?^`{|}~-]+(\.[\w!#$%&amp;'*+\/=?^`{|}~-]+)*@(([\w-]+\.)+[A-Za-z]{2,6}|\[\d{1,3}(\.\d{1,3}){3}\])$/;
		    if (!regmail.test($("#email").val())) {
			msg +='\nPreencha o campo e-mail';
				  
		    }
				
		    //Verifica se o campo assunto esta em branco
		    if($('#assunto').val() == ''){
	            	msg +='\nPreencha o campo assunto';
	            	
	            }
				
		    //Verifica se o campo mensagem esta em branco
	            if($('#msg').val() == ''){
	            	msg +='\nPreencha o campo mensagem';
	            	
	            }
	            
		    //Se a variavel msg for diferente de vazio vai mostrar a mensagem com o erro ou erros se msg vazio faz o submit do formulário
	            if(msg != ''){
	                alert(msg);
	                return false;
	            }else{
	                return true;
	            }
	      });
	  });
     
</script>
 
<h1>Contato</h1><br/>
<form  name="contato" id="formcontato" method="post" action="">
  <fieldset style="border:0;">
	  <label>Nome:</label>
	  <input name="nome" type="text" id="nome" size="30" maxlength="50" /><br /><br />
	  <label>E-mail:</label>
	  <input name="email" type="text" id="email" size="30" maxlength="100" /><br /><br />
	  <label>Assunto:</label>
	  <input name="assunto" type="text" id="assunto" size="30" maxlength="20" /><br /><br />
	  <label>Mensagem:</label><br /><br />
	  <textarea rows="5" cols="23" id="msg" name="msg"></textarea><br /><br />
	  <input  type="submit" name="submit" value="Enviar" /> 
  </fieldset> 
 </form>

</body>
</html>