Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Ajuda!!!

Referente ao curso JavaScript e HTML: desenvolva um jogo e pratique lógica de programação, no capítulo Interaja de maneira diferente com o usuário e atividade Consolidando seu conhecimento

por Alexsandro De Jesus Xavier
| 87.1k xp | 14 posts

Eu implimentei o button e input no exercicio da calculadora, porém eu não consegui fazer com que o ele continuasse na tela pra ser reutilizado, se alguém poder me ajudar com isso ficarei grato!

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>
    <input type="" name="">
    <button>Calcular</button>
    <br>
<script type="text/javascript">

    function pulaLinha() {
        document.write("<br>");
    }

    function mostra(texto) {
        document.write(texto);
        pulaLinha()
    }

    function calcular(){
        while(num <= 10){
        mostra(num + " x " + input.value + " = " + (num * input.value));
        num++;        }
    }

    var button = document.querySelector("button");
    var input = document.querySelector("input");
    var num = 1;

    input.value = "";
    button.onclick = calcular;

</script>
</body>
</html>
1 resposta
solução!
por Guilherme Henrique
| 733.8k xp | 2109 posts
Instrutor

Oi Alexsandro

O document.write reescreve todo o HTML novamente da página apagando tudo que existia, para manter você precisa utilizar outra função para isso. Você precisa adicionar tags novas ou conteúdo ao document, existem várias alternativas para isso, vou passar uma solução simples aqui pra você: 

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta charset="utf-8" />
  </head>
  <body>
    <input type="" name="" />
    <button>Calcular</button>
    <br />
    <div></div>

    <script type="text/javascript">
      function calcular() {
        var num = 1; // tive que passar para dentro da função para iniciá-lo toda vez que clicar
        var resultado = ''; // criei uma variável que terá todo o somatório pra depois jogar ela dentro de um elemento

        while (num <= 10) {
          resultado =
            resultado +
            (num + ' x ' + input.value + ' = ' + num * input.value) +
            '<br/>';
          num++;
        }
        input.value = ''; // limpando o input
        input.focus(); // deixando o cursor já no input
        div.innerHTML = resultado; // aqui eu estou jogando todo o conteúdo gerado pelo while pra dentro da div
      }

      var button = document.querySelector('button');
      var input = document.querySelector('input');
      var div = document.querySelector('div');

      input.value = '';
      button.onclick = calcular;
    </script>
  </body>
</html>

Existem diversas maneiras de fazer, porém não sei quais posso apresentar pra não sair muito da linha do curso ou trilha que você está.