Como evitar o envio de múltiplas submissões em um formulário HTML com Javascript

Olá amigos.

Hoje irei mostrar uma solução muito simples, mas que em alguns casos pode evitar uma dor
de cabeça no futuro: o envio de múltiplas submissões em um formulário HTML.

O problema acontece quando alguém preenche um formulário HTML e dá duplos cliques no botão "Enviar" causando o envio de duas ou mais submissões.

Estarei trabalhando com jQuery 2.1.3. Vejamos:



Agora adicionaremos a instrução "$("#enviar").prop("disabled", true);" para desabilitar o botão na função do evento onclick. Vejamos agora:



Pronto! Problema solucionado.

Esse bloqueio é feito apenas no lado do navegador. Caso seja necessário bloquear também no lado do servidor é preciso trabalhar com variáveis de sessão conforme a linguagem de programação utilizada. Mas isso é um assunto para outro post.

Dúvidas, sugestões e elogios adicione comentários.
Até mais.

Referências:
Stack Overflow, Javascript - .prop() vs .attr(). Disponível em: <http://stackoverflow.com/questions/5874652/prop-vs-attr> Acesso em 30 de agosto de 2015.

A utilização da tag HTML <marquee> com a alteração de conteúdo e cores dos elementos em tempo de execução

Olá pessoal.

Hoje irei mostrar a utilização da tag HTML <marquee> junto com a alteração de conteúdo e cores dos elementos em tempo de execução.

Também será apresentado a propriedade innerHTML do Javascript Puro que é utilizada para alterar o conteúdo HTML dentro de uma tag especificada.

O objetivo da tag <marquee> é fazer com que quaisquer outros elementos HTML que tiverem dentro dessa tag seja deslocados da direita para esquerda progressivamente criando uma animação. Essa tag é raramente utilizada hoje em dia devido aos inúmeros recursos que o HTML5 pode nos proporcionar. Mas ela ainda pode ser muito útil em alguns casos.

A propriedade innerHTML do Javascript Puro foi utilizada para alterar o texto existente dentro da tag <label> quando o botão "Alterar" for clicado.

As cores dos elementos são alteradas através da mudança das classes CSS utilizando as funções setAttribute no Javascript Puro e prop no jQuery.

Bem então chega de blá blá blá e vamos ver os resultados dessa brincadeira:

(Neste exemplo foi usado Javascript Puro.)


(Neste exemplo foi usado jQuery 2.1.3 .)


Dúvidas, sugestões e elogios adicione comentários.
Até a próxima

Referências:
Fundação jQuery, jQuery API. Disponível em: <http://api.jquery.com/> Acesso em 2 de agosto de 2015.

Permitir digitar apenas números no campo de um formulário com Javascript

Olá pessoal.

Essa é a minha primeira postagem no blog. :-D

Hoje irei apresentar uma solução feita com Javascript Puro que faz com que o usuário digite apenas números em um campo no formulário.

Existem diversas soluções pela internet para esse problema como alguns plugins para o jQuery e etc. Mas com Javascript Puro a mais simples que encontrei foi essa:



Esse script faz com que apenas as teclas dos números de 0 à 9 sejam aceitas usando o evento onkeypress.

Dúvidas, sugestões e elogios adicione comentários.
Até a próxima.