JScript

Programação & Desenvolvimento


Você não está conectado. Conecte-se ou registre-se

Mostrar uma mensagem de erro para um input

4 participantes

Ir para baixo  Mensagem [Página 1 de 1]

joelson0007

joelson0007
Moderadores
Moderadores

Código:

function inputError(str, msg) {
    var el = (document.getElementById(str.substring(1))|| document.getElementsByName(str)[0]);
    if (typeof el === 'object') {
        el.blur();el.style.backgroundColor = 'rgb(255, 174, 174)';
        el.value = msg;setTimeout(function () {el.value = '';}, 500);
        el.setAttribute('placeholder', msg);
        el.addEventListener("focus", function () {
            this.setAttribute("placeholder", "");
            this.style.backgroundColor = '#fff';
            this.removeEventListener("focus");
        });
    }
}
exemplo para um input

Código:

inputError('#main_search', 'este campo está com erro')
exemplo para o atributo name
Código:

inputError('description', 'este campo está com erro')

Legolas

Legolas
Moderadores
Moderadores

Muito bom! Já estou pensando em usar isso Twisted Evil 

http://aden.rpgwars.net

JScript

JScript
Administradores
Administradores

Perfeito, só achei o nome da função um pouco esquisito, poderia ser apenas input() ou inputEx()...

JS

http://autoitbrasil.com

joelson0007

joelson0007
Moderadores
Moderadores

Dependendo da maneira, parece que a função vai colocar um erro num input Embarassed 

JScript

JScript
Administradores
Administradores

hummm, então deixa ver se eu entendi direito: Isso é uma função para placeholder ?

Eu pensei de início que era pra detectar algum erro no input...

JS

http://autoitbrasil.com

joelson0007

joelson0007
Moderadores
Moderadores

é eu uso o placeholder para mostrar uma mensagem de erro e trabalho com o focus, para quando o usuário clicar, voltar o input ao normal.

Acho que dá pra fazer mais alguns ajustes, mas eu gostei do efeito final.

JScript

JScript
Administradores
Administradores

humm, entendi melhor, é verdade que fica um efeito muito bom mesmo!

Vamos fazer mais testes ai...

Curti!

JS

http://autoitbrasil.com

waghcwb

waghcwb
Desenvolvedores
Desenvolvedores

Perfeito, dias atrás estava querendo saber como faria para editar algo no placeholder..

http://wagneraugusto.com.br/

Conteúdo patrocinado



Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos