As vezes precisamos ajudar o usuário à preencher formulários, dizendo o que pode e não pode ser digitado nos campos. Na minha opnião este tipo de ajuda nunca é demais. Valendo-se da filosofia do jQuery (escrever pouco, produzir muito), escrevi este script para tal.
var help = function() {
return {
init: function() {
var $form = $('form');
var tip = null;
$(':text',$form).each(function(){
$(this).bind('focus',function(){
tip = document.createElement('span');
$(this).after( $(tip).text( $(this).attr('tips') ) );
}).blur(function(){
if (tip) {
$(tip).remove();
tip = null;
}
return;
});
});
}
}
}();
$(document).ready(help.init);
HTML
<form> <input type="text" name="teste1" tips="Este input é muito importante..." /><br /> <input type="text" name="teste2" tips="Digite qualquer coisa..." /><br /> <input type="text" name="teste3" tips="Terceiro, esta quase acabando..." /><br /> <input type="text" name="teste4" tips="Seja persistente" /><br /> <input type="text" name="teste5" tips="Último input, caso tenha preenchido os anteriores, boa sorte!" /> </form>
[s]
JunioR
essa parte do codigo nao funciona
$(‘:text’,$form).each(function(){
ele nao captura o form
como voce fez?
$form é apenas uma variável. Nesta linha estou buscando todos os inputs type text dentro do contexto do formulário
var $form = $('form');$form retorna um objeto jQuery com o DOM da tag form
Demo
[s]