-1

Comecei agora em JavaScript e estou tentando retornar algumas respostas de perguntas usando JavaScript, mas não estou conseguindo, não sei aonde estou errando.

function conferir() {
  var A = document.getElementsById('question')
  var B = document.getElementsById('first')
  var C = document.getElementsById('second')

  if (A == B) {
    greeting = 'Você é muito fã';
  } else {
    greeting = 'Talvez curta um Dolly';
  }

}
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title> Quiz </title>
  <link rel="stylesheet" href="Style/style.css">
  <script src="Style/script.js"></script>
</head>

<body>
  <h3 id="question"> Você é fã de Coca-Cola? </h3>
  <input type="radio" id="first">
  <label> SIM </label><br>
  <input type="radio" id="second">
  <label> NÃO </label><br>

  <br>

  <button type="button" onclick="document.getElementById('demo').innerHTML = conferir()">
        Resultado</button>

  <p id="demo"></p>
</body>

</html>

2 Respostas 2

0

A solução do seu problema é esse aqui:

  1. Remova o trecho de código do botão: Resultado e deixe apenas a chamada da função no seu código:

<button type="button" onclick="conferir()">Resultado</button>

  1. Atente-se a escrita da sintaxe na sua pergunta o existe um comando errado. Não é getElementsById e sim getElementById no singular.
  2. Você na estava declarando e nem retornando valor da variavél gretting.
function conferir() { 

    var A = document.getElementById('question');
    var B = document.getElementById('first') 
    var C = document.getElementById('second');
    var greeting = "";

    if (A == B) { 
        greeting = 'Você é muito fã'; 
    } else { 
        greeting = 'Talvez curta um Dolly'; 
    }

    document.getElementById('demo').innerHTML = greeting;   
}

Apenas substitua os trechos apontados e teste para ver se funcionou.

Segue o exemplo funcionando:

function conferir() {

  var A = document.getElementById('question');
  var B = document.getElementById('first')
  var C = document.getElementById('second');
  var greeting = "";

  if (A == B) {
    greeting = 'Você é muito fã';
  } else {
    greeting = 'Talvez curta um Dolly';
  }

  document.getElementById('demo').innerHTML = greeting;

}
<h3 id="question"> Você é fã de Coca-Cola? </h3>
<input type="radio" id="first">
<label> SIM </label><br>
<input type="radio" id="second">
<label> NÃO </label><br>

<br>

<button type="button" onclick="conferir()">Resultado</button>

<p id="demo"></p>

1
  • Muito obrigado! Consegui entender, me ajudou muito! 16/06/2022 às 16:56
0

Haviam alguns erros no codigo.

  • O seu codigo esta permitindo selecionar as 2 respostas.
    Para corrigir os 2 inputs devem ter o mesmo name.
    Isso fara com que apenas 1 possa ser selecionado. Assim:

      <input type="radio" id="first" name="anser">
      <label for="first">SIM </label><br>
      <input type="radio" id="second" name="anser">
      <label for="second">NÃO </label><br>
    

    Perceba também que adicionei um atributo for, no label, que linka ele ao ID do input

  • A verificação esta incorreta
    A == B, sempre retornara false pois são coisas diferentes
    A é um input e B é outro. Você deve verificar se A está marcado ou B esta marcado, quando clicar no Botão

      const A = document.getElementById('first') 
      const B = document.getElementById('second')
    
      if (A.checked) { 
        alert('Você é muito fã de Coca-Cola'); 
      } else if (B.checked) { 
        alert('Talvez curta um Dolly'); 
      }
    
  • Não use VAR! veja videos sobre let e const, são mais recomendados hoje em dia.

  • Como ja citado o correto é getElementById, no singular pois vc ta pegando apenas uma "coisa";

  • O evento onclick deve referenciar apenas a função conferir

    <button type="button" onclick="conferir()">
      Resultado
    </button>
    

Codigo completo abaixo

  <h3> Você é fã de Coca-Cola? </h3>
  <input type="radio" id="first" name="anser">
  <label for="first">SIM </label><br>
  <input type="radio" id="second" name="anser">
  <label for="second">NÃO </label><br>
  
  <br>

  <button type="button" onclick="conferir()">
    Resultado
  </button>
  
  <p id="demo"></p>

  <script>

    function conferir() { 
      const A = document.getElementById('first') 
      const B = document.getElementById('second')

      if (A.checked) { 
        alert('Você é muito fã de Coca-Cola'); 
      } else if (B.checked) { 
        alert('Talvez curta um Dolly'); 
      }
    }
  </script>
1
  • Muito obrigado! Consegui entender, me ajudou muito, vou usar como base para entender melhor outros projetos também, mais uma vez muito obrigado! 16/06/2022 às 16:55

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .