Entrar Ainda não tem acesso?
1
resposta

Dúvida de como usar função ENTER no código

Referente ao curso JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

por Maria Gabriela Carvalho Amorim
| 50.9k xp | 7 posts

Olá pessoal alguém sabe me dizer como eu coloco uma função para clicar com o enter neste código? 

<meta charset="utf-8">

<input/>
<button>Compare com o meu segredo</button>

<script>

    var segredo = 5;
    var input = document.querySelector("input");

    function verifica() {

            if(input.value == segredo){

            alert("Você acertou!");

        } else {

            alert("Você errou!");
        }



    }

    var button = document.querySelector("button");
    button.onclick = verifica;


</script>
1 resposta
por Murillo Godoi Pedroso
| 720.3k xp | 1256 posts
Alura Scuba Team

Oi, Maria, como vai?

Sinto muito pela demora em retornar.

Esse comportamento é padrão dos formulários feitos com HTML5. Entretanto, é possível simular com JavaScript, adicionando um ouvinte de eventos que executará uma função quando a tecla enter for pressionada.

O código ficará assim:

<meta charset="UTF-8">

<button>Clique-me</button>

<script>

  function tchau() {
    alert("Tchau!!!!!")
  }

  var button = document.querySelector("button");
  button.addEventListener('keypress', function(event){
    if(event.keyCode == 13) {
      event.preventDefault();
      tchau();
    }
  });

</script>

Então, foi preciso adicionar um ouvinte de eventos no botão que ficará responsável por "escutar" quando a tecla enter for pressionada. Cada tecla possui um código identificador, o código da tecla enter é 13, então quando um evento acontecer com o código 13 quer dizer que a tecla enter foi pressionada, e se isso acontecer nós temos uma condição para executar a funçãotchau().

Espero ter ajudado.

Abraços e bons estudos!