Pular para o conteúdo principal

Postagens

Mostrando postagens com o rótulo JavaScript

JavaScript + OO + Herança

Neste segundo post sobre orientação a objetos com Javascript irei demonstrar como utilizar o conceito de herança. Para se fazer uso de herança em javascript deve-se utilizar a propriedade prototype, os objetos em javascript contém uma propriedade “especial” chamada prototype que permite que seja adicionado métodos e propriedades as classes. Quando se define um valor para a propriedade prototype, no momento em que se cria uma instância de uma classe em javascript, as propriedades prototypes são acopladas a classe. O exemplo ira se basear em uma classe chama Carro com um atributo nome, seu método get e set e uma classe Moto com um atributo cilindradas que irá herdar os atributos e métodos da classe Carro. Primeiro o javascript para a classe Carro: <script type="text/javascript" language="javascript"> function Carro() { this.placa; this.setPlaca = setPlaca; this.getPlaca = getPlaca; function setPlaca(placa) { this.p...

Javascript + OO

Embora a maioria dos scripts feitos em Javascript seja feito utilizando utilizando programação estruturada, também pode-se utilizar os conceitos de orientação a objetos em Javascript. Para exemplificar, irei me basear em uma classe chama Carro com atributos placa, ano e modelo, seus métodos getters e setters e um método chamado mostraDetalhes que irá retorna uma string com os valores dos atributos da classe. Veja o exemplo no código a seguir: <script language="javascript"> function Carro() { var placa; var ano; var modelo; this.getPlaca = getPlaca; this.getAno = getAno; this.getModelo = getModelo; this.setPlaca = setPlaca; this.setAno = setAno; this.setModelo = setModelo; this.mostraValores = mostraValores; function getPlaca() { return placa; } function getAno() { return ano; } function getModelo() { return modelo; } function setPlaca(_placa) { placa = _placa; } f...

Verificando o Navegador do Cliente

Muitos desenvolvedor web se perguntam: - Como saber o Navegador que o usuário esta usando? Na maioria das vezes essa pergunta é feita para aplicar um tipo de CSS diferente para cada base de navagador. A resposta é simples de se responder com apenas uma linha utilizando-se JavaScript if (navigator.appName == "Netscape") Esse linha lhe retorna true ou false, se o retorno for true é porque o navegador é de base Netscape, ou seja, FireFox, Opera, Chrome, ..., mas se o retorno for false é porque o navegador é Internet Explorer. Muito bem dessa maneira é possivel saber qual o navegador do cliente e aplicar um CSS diferente para cada tipo de navegador. Forte Abraço, e até a próxima.

Validadores em Javascript

Olá pessoal Quem nunca viu para ai nas páginas na internet esse validadores de campos, pois bem nesse artigo vou mostra como validar 14 tipo de campos diferentes através de expressões regulares utilizando Javascript, primeiramente é necessário as variáveis com as expressões regulares conforme abaixo, no final de cada expressão regular tem um comentário sobre a expressão, e ainda o nome da variável é vem sugestivo, por exemplo a variável email é a expressão regular de email. Um ultimo detalhe expressões regular não validam exatamente o valor mas sim o padrão do valor infonado. var email = /^.+@.+\..{2,3}$/;//expressão regular que valida email var inteiro = /^[\-\+]?\d*$/;//expressão regular que valida inteiro var url = /^(([\w]+:)?\/\/)?(([\d\w]|%[a-fA-f\d]{2,2})+(:([\d\w]|%[a-fA-f\d]{2,2})+)?@)?([\d\w][-\d\w]{0,253}[\d\w]\.)+[\w]{2,4}(:[\d]+)?(\/([-+_~.\d\w]|%[a-fA-f\d]{2,2})*)*(\?(&?([-+_~.\d\w]|%[a-fA-f\d]{2,2})=?)*)?(#([-+_~.\d\w]|%[a-fA-f\d]{2,2})*)?$/;//expressão regular que ...

Abrir Janela Modal

Olá pessoal Quem utiliza Delphi win32 no seu dia-a-dia deve conhecer a funcionalidade de Showmodal que existe para controlar a abertura de Formulario, de maneira que o usuário apenas posso interagir com o formuário aberto e não posso interagir com os demais, apenas se fechar o fomulário, em javascrip existe uma função que faz o mesmo controle, conforme exemplo abaixo window.showModalDialog('link','nomeJanela','afins'); Agora você implementar esssa funcionalidade nas suas páginas WEB. Forte abraço e até o próximo artigo.

Preencher Data e Hora

Muito bem neste post irei demostrar como preencher campos data e hora com apenas uma tecla, sem precisar digitar toda a data ou toda a hora atual, utilizando Javascript, primeiramente vamos criar as duas funções que retorna a data e a hora atual, conforme exemplo abaixo A função a seguir retorna a hora no seguinte formato hh:mm:ss function HoraAtual(obj) { var hora = document.getElementById(obj); if (hora.disabled==false) { var t = new Date(); var h = t.getHours(); var m = t.getMinutes(); var s = t.getSeconds(); if (h h = "0" + h; if (m m = "0" + m; if (s s = "0" + s; hora.value = h +":"+ m +":"+ s; hora.focus(); hora.select(); } } A função a seguir retorna a hora no seguinte formato dd/MM/yyyy function DataAtual(obj) { var data = document.getElementById(obj); if (data.disabled==false) { var t = new Date(); var d = t.getDate(); var m = t.getMonth(...

Força de Uma Senha Através de JavaScript

Alguma vez já lhe passou pela cabeça em fazer um validador de senha, para informar ao usuário se a senha digitava por ele é fraca, relevnte ou forte, pois bem vou apresentar uma solução simples em JavaScript, utilizando um INPUT do tipo PASSWORD uma DIV na qual irei mostra a mensagem e alterar sua cor de funo de acordo com a mensagem . Atraves da seguinte function em Javascript que é chama no onkeyup do INPUT da senha vamos verificar a senha function verificaForca(campo) { var div=document.getElementById('div_forca_senha'); var valor = campo.value; var contemNumeros = /[0-9]/; var contemLetras = /[a-z]/i; var contemEsp ecial = /[@#$%&amp;*]/; var contagem = 0; if ( valor.length > 0 ) { if (contemNumeros.test(valor)) contagem++; if (contemLetras.test(valor)) contagem++; if (contemEspecial.test(valor)) contagem++; switch ( contagem ) { ...