0

Olá, estou escrevendo uma pagina com um jogo de Pedra Papel ou Tesoura. E gostaria que o usuário pudesse escolher entre as três opções através de três botões, que quando clicados chamam uma função que atribui um valor a variável relativa a jogada do usuário, e em seguida realiza comparações para saber quem ganhou(Computador ou Usuário). Meu problema e que não consigo fazer com que a variável a receba os valores equivalentes a jogadas usando as funções.

Obs: Meu algorítimo para comparar as jogadas tanto do PC quanto do Usuário esta funcionando, por isso não postei junto.

var a = 0;

function Pedra() {
  return a = 1;
}

function Papel() {
  return a = 2;
}

function Tesoura() {
  return a = 2;
}

if (a == 1) {
  alert("pedra");
}
if (a == 2) {
  alert("Papel");
}
if (a == 3) {
  alert("tesoura");
}
<div>
  <div>
    <button type="button" onclick="Pedra()">Pedra</button>
  </div>

  <div id="papel">
    <button type="button" onclick="Papel()">Papel</button>
  </div>

  <div id="tesoura">
    <button type="button" onclick="Tesoura()">Tesoura</button>
  </div>
</div>

0

3 Respostas 3

0

Não sei se entendi direito sua dúvida, mas vamos lá.

1 - Métodos em javascript seguem o padrão camelCase, sendo a primeira letra do método minúscula e a primeira letra das palavras restantes maiúsculas. Nomear os métodos como sendo ações, neste caso escolher (isso não influenciou em seu código não funcionar, só boa prática mesmo)

2 - Não é necessário o return em cada método, já que você só precisa atribuir o valor à variável a que está declarada de forma global

3 - Para cada clique, é necessário chamar o método verificarEscolha(), assim você vai conseguir exibir de fato o valor selecionado a cada clique de botão.

var a = 0;

function escolherPedra() {
  a = 1;
  verificarEscolha()
}

function escolherPapel() {
  a = 2;
  verificarEscolha()
}

function escolherTesoura() {
  a = 3;
  verificarEscolha()
}

function verificarEscolha(){
  if (a == 1) {
    alert("pedra");
  }
  if (a == 2) {
    alert("Papel");
  }
  if (a == 3) {
    alert("tesoura");
  }
}
<div>
  <div>
    <button type="button" onclick="escolherPedra()">Pedra</button>
  </div>

  <div id="papel">
    <button type="button" onclick="escolherPapel()">Papel</button>
  </div>

  <div id="tesoura">
    <button type="button" onclick="escolherTesoura()">Tesoura</button>
  </div>
</div>

0

Uma forma ainda mais simples seria passar a opção que o usuário escolheu como parâmetro de uma função e lá fazer a verificação

Nesse exemplo fiz com switch case, se prefirir pode manter os if else

function jogar(usuario) {
  switch(usuario) { 
    case 1:
      alert("pedra");
      break;
    case 2:
      alert("Papel");
      break;
    case 3:
      alert("tesoura");
      break;
    default:
      alert("Opção inválida");
      break;
  }
}
<div>
  <div>
    <button type="button" onclick="jogar(1)">Pedra</button>
  </div>

  <div id="papel">
    <button type="button" onclick="jogar(2)">Papel</button>
  </div>

  <div id="tesoura">
    <button type="button" onclick="jogar(3)">Tesoura</button>
  </div>
</div>

0

Como não sei como está o resto do seu código, vou supor que seu único problema realmente seja que não esteja conseguindo alterar o valor de a.

Tecnicamente seu código "está correto". Então uma possibilidade é que você não está realmente alterando a mesma variavel a que foi declarada no inicio.

A única possibilidade para isso é um problema de escopo:
Se a variável a não for global, a variável a fora das funções é uma, e as variáveis a são outras, onde cada uma é diferente / independente.
Então na verdade você estaria alterando variáveis distintas.

Para resolver isso tente declarar a variável a fora de qualquer função.


Tente deixar seu código semelhante a este ( que está funcionando), e então vá alterando a testando para ver onde está o erro:

 <script>

    function imprimeValorDoa(){
        alert("o valor de a é : " + a);
    }
    var a = 0;

    function Pedra() {
      a = 1;
    }

    function Papel() {
      a = 2;
    }

    function Tesoura() {
      a = 3;
    }

</script>

<div>
  <div>
    <button type="button" onclick="Pedra(); imprimeValorDoa()">Pedra</button>
  </div>

  <div id="papel">
    <button type="button" onclick="Papel(); imprimeValorDoa()">Papel</button>
  </div>

  <div id="tesoura">
    <button type="button" onclick="Tesoura(); imprimeValorDoa()">Tesoura</button>
  </div>
</div>

Nota: o que podia estar acontecendo no seu código é que na verdade estava sim alterando o valor de a corretamente. Porém o trecho dos if(a == ...) era executado antes do clique no botão.
Isto acontece por quê o if está dentro do script, e todo os script são executados por completo quando a pagina html é carregada.

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 .