Você está aqui: JavaScript ::: Dicas & Truques ::: Mouse e Teclado

Como retornar o código da tecla pressionada em um elemento HTML usando o evento onkeypress do JavaScript

Quantidade de visualizações: 127 vezes

Nesta dica eu mostrarei como é possível usar o evento onkeypress do HTML + JavaScript para obter o código da tecla pressionada pelo usuário. Note que usei a propriedade keyCode do objeto event para capturar o código da tecla.

Veja o código JavaScript completo, incluindo a página HTML:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudando JavaScript</title>
</head>
<body>
 
<p>Experimente pressionar qualquer tecla e uma 
mensagem mostrará o código da tecla pressionada.</p>
 
<script type="text/javascript">
  function tecla(){
    window.alert("O código da tecla pressionada foi: "
      + event.keyCode);
  }
   
  document.body.onkeypress = tecla;
</script>
 
</body>
</html>

Abra esta página no seu navegador e experimente pressionar uma tecla. Se você presssionar, por exemplo, a tecla "a", teremos a seguinte mensagem:

O código da tecla pressionada foi: 97

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como retornar o índice da primeira ocorrência de um elemento em um array do JavaScript usando a função indexOf()

Quantidade de visualizações: 2362 vezes

Em algumas ocasiões nós precisamos obter e retornar o índice da primeira ocorrência de um determinado elemento em um array JavaScript. Para isso podemos usar a funções indexOf(). Se o elemento não puder ser encontrado, o valor -1 é retornado.

Veja um exemplo de seu uso:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 2, 2, 4, 5);
  // vamos obter o índice da primeira ocorrência
  // do elemento com o valor 2
  var indice = valores.indexOf(2);
  window.alert("Elemento encontrado no índice: " 
    + indice);
</script>

Execute o código e veja que o elemento foi encontrado no índice 1, ou seja, na segunda posição do array, já que os índices de vetor e matriz em JavaScript começam a partir de 0.

Experimente pesquisar o valor 50 e verá que o valor retornado é -1, indicando que o elemento não foi encontrado.

JavaScript ::: Fundamentos da Linguagem ::: Estruturas de Controle

JavaScript para iniciantes - Como testar condições em JavaScript usando if e if..else

Quantidade de visualizações: 10246 vezes

As estruturas if (se) e if..else (se..senão) da linguagem JavaScript são muito usadas quando queremos testar condições em nossos códigos e, dependendo do resultado do teste, efetuar desvios na execução das instruções. Veja a sintáxe do if:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

if(condição){
  // instrução ou conjunto de instruções
}

A condição é qualquer teste que resulte em um valor boolean (true ou false). Veja, por exemplo, como podemos verificar se um valor é maior que 10:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
  var valor = 15;

  // vamos testar se o valor é maior que 10
  if(valor > 10){
    document.write("O valor é maior que 10.");
  }  
</script>

</body>
</html>

Ao executarmos este código, o texto "O valor é maior que 10." será exibido na tela. Porém, também gostaríamos de exibir uma mensagem caso o valor não for maior que 10. Para isso podemos usar a cláusula else. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  var valor = 5;

  // vamos testar se o valor é maior que 10
  if(valor > 10){
    document.write("O valor é maior que 10.");
  }
  else{
    document.write("O valor NÃO é maior que 10.");
  }  
</script>

Ao executarmos o exemplo novamente, o texto "O valor NÃO é maior que 10." será exibido. Isso aconteceu porque, ao não satisfazer a condição do if, o fluxo de código caiu na cláusula else.

Há algumas situações nas quais precisamos testar muitas condições ao mesmo tempo. Assim, além do if e else podemos empregar também a cláusula else if (senão se). Veja um exemplo no qual expandimos o exemplo anterior para testar se o valor é maior, menor ou igual a 10:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
  var valor = 5;

  // vamos testar se o valor é maior, menor ou igual a 10
  if(valor > 10){
    document.write("O valor é maior que 10.");
  }
  else if(valor < 10){
    document.write("O valor é menor que 10.");
  }
  else{
    document.write("O valor é igual a 10.");
  }  
</script>

</body>
</html>

Esta dica foi escrita e testada no Internet Explorer 8 e Firefox 3.6.

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como adicionar um ou mais elementos ao início de um vetor JavaScript usando o método unshift() do objeto Array - [Revisado]

Quantidade de visualizações: 7098 vezes

O método unshift(), presente no JavaScript desde sua versão 1.2, é usado quando queremos adicionar um ou mais elementos no início de um vetor (array). Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 4, 5);
  document.write("Valores no vetor: " + valores + "<br>");
  valores.unshift(6);
  document.write("Novos valores no vetor: " + valores);
</script>

Aqui nós adicionamos o valor 6 no início do vetor. Veja agora como adicionar três valores no início do vetor:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 4, 5);
  window.alert("Valores no vetor: " + valores);
  valores.unshift(6, 7, 8);
  window.alert("Novos valores no vetor: " + valores);
</script>

É importante observar que a função unshift() modifica o vetor original, e seu retorno é a nova quantidade de elementos no vetor.

Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

Como somar dois números em JavaScript - O operador de adição da linguagem JavaScript - Exercícios Resolvidos de JavaScript

Como subtrair dois números em JavaScript - O operador de subtração da linguagem JavaScript - Exercícios Resolvidos de JavaScript

Como testar se uma string está vazia em JavaScript - Exercício Resolvido de JavaScript

Como encontrar o menor valor em um array de inteiros em JavaScript - Exercícios Resolvidos de JavaScript

Como testar se o argumento de uma função JavaScript é do tipo String - Exercícios Resolvidos de JavaScript

Como testar se uma variável é do tipo string em JavaScript - Exercício Resolvido de JavaScript

Como multiplicar dois números em JavaScript - O operador de multiplicação da linguagem JavaScript - Exercício Resolvido de JavaScript

Ler três números inteiros e indicar se eles estão em ordem crescente ou decrescente - Exercícios Resolvidos de JavaScript

Veja mais Dicas e truques de JavaScript

Como retornar a última palavra de uma string em JavaScript usando as funções split() e reverse()

Como retornar o maior valor em um array JavaScript usando a função max() e o operador spread do ES6

Como usar a propriedade length do objeto Array para redimensionar uma matriz JavaScript em tempo de execução

Como usar o método getElementById() do objeto document para localizar um elemento HTML baseado em seu id usando JavaScript

Como obter o código da tecla pressionada em um elemento HTML usando o evento onkeypress do JavaScript

Como remover os espaços no final de uma string em JavaScript usando uma função trim_final() personalizada

Como obter a quantidade de elementos em um array

Como calcular o seno de um número ou ângulo em JavaScript usando a função sin() do objeto Math

Como usar o método apply para herdar as características de um outro objeto

Limitar a quantidade de caracteres em um textarea

Dicas e truques de outras linguagens

Java - Como somar os valores dos elementos de um vetor de inteiros em Java

C - Como calcular a transposta de uma matriz em C - Curso de C para Geometria Analítica e Álgebra Linear

C# - Como excluir todos os itens de uma ListBox do C# Windows Forms usando a função Clear()

Java - Como definir um ícone para a janela do aplicativo Java Swing usando o método setIconImage() da classe JFrame

JavaScript - Exercício Resolvido de JavaScript - Como somar dois números em JavaScript - O operador de adição da linguagem JavaScript

Java - Exercício Resolvido de Java - Escreva um programa Java console que solicite ao usuário que informe dois valores inteiros. Em seguida seu programa deverá efetuar a soma dos dois valores e exibí-la

JavaScript - Como subtrair dias de uma data em JavaScript - Data e horas em JavaScript

Java - Como usar o método next() da interface Iterator do Java para obter o próximo elemento da iteração

JavaScript - JavaScript para matemática - Como obter o menor entre dois ou mais valores numéricos usando a função min() do JavaScript

Java - Como remover quebras de linhas de uma string - Como usar o método replaceAll() da classe String para remover quebras de linha de um texto - Revisado

Códigos Fonte

Programa de Gestão Financeira Controle de Contas a Pagar e a Receber com Cadastro de Clientes e Fornecedores

Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimento
Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais

Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidades
Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: C
6º lugar: Delphi
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby

Você está aqui: JavaScript ::: Dicas & Truques ::: Mouse e Teclado

Como retornar o código da tecla pressionada em um elemento HTML usando o evento onkeypress do JavaScript

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como retornar o índice da primeira ocorrência de um elemento em um array do JavaScript usando a função indexOf()

JavaScript ::: Fundamentos da Linguagem ::: Estruturas de Controle

JavaScript para iniciantes - Como testar condições em JavaScript usando if e if..else

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como adicionar um ou mais elementos ao início de um vetor JavaScript usando o método unshift() do objeto Array - [Revisado]

Questões de Concurso para Engenharia Civil

Exercícios Resolvidos

Bancos de Dados

Questões de Concurso

Frameworks

Projetos e Códigos Fonte

Especializações

Calculadoras

Ferramentas

Todas as Linguagens, Frameworks, Biliotecas e Bancos de Dados

Compre pelo WhatsApp: +55 (062) 98553-6711

E-Book 650 Dicas, Truques e Exercícios Resolvidos de Python - Com comentários em Português

PDF COM 1.200 PÁGINAS

Apenas R$ 32,90