Ir para conteúdo
Fórum Script Brasil
  • 0

Variáveis, if, Function


AlbertoRT

Pergunta

Estou estudando para colocar um JavasScript em um html mas não está fácil. Tudo no início é muito complexo mas não vou desistir de programar em JavaScript.

Desculpe alguma coisa mas estou iniciando e tenho dificuldade de colcar as coisas. Vou tentar!

Bem a idéia é uma página com diversas Perguntas e com 5 opções. Uma só letra é a Correta. (um amigo alertou para não fazer que o pessoal vai "corujar" o código fonte. Não tem problema é só para estudo.) Por exemplo: Estou na Pergunta 10 e a Questão "a" é a Correta. Se marquei no checkboxes do lado da letra "a" gostaria que aparecesse "Parabéns você acertou!" se clicar na letra "b" que é a errada aparecesse "Resposta Incorreta. Leia novamente a pergunta!".

Dentro do <head> digitei:

<script language="javascript">
<!--
 function Resultado ()
 {
     Correto = "Parabéns você acertou!"
                Incorreto = "Resposta Incorreta. Leia novamente a pergunta!"
}

<!--
  function Resposta ()
  {
       P10_a = "Correto"
}
</script>
</head>
Obs. A variável "P10_a" estou me referindo a Pergunta 10 da Questão "a" é a correta. Se a logica for essa vou digitar todas as variáveis P1_b, P2_c...............P100_d. Tentei chamar a variável "Correto" dentro da Function Resposta. Deve ser uma bobagem muito grande. Resumindo estou tentando. No <body> do lado da letra onde fica opções das perguntas digitei por exemplo para a Pergunta 10 na letra "a":
<input type="checkbox" name="P10_a" id="P10_a" value="checkbox" onclick= "javascript.resposta" />

Abro a página clico na Questão "a" da Pergunta 10 e nada acontece.

Estou errando nas function, dever ter algum if, não estou sabendo chamar a varíavel no checkbox etc. Como disse estou iniciando e uma ajuda poderia me levar ao sucesso. Sabendo fazer uma questão as demais não seria só ir seguindo a lógica?

Muito obriado. Antes procurei na opção pesquisa mas não achei dever ter algo parecido mas não achei. Desculpe alguma coisa.

Editado por Jonathan Queiroz
Adcionar tag's (Jonathan)
Link para o comentário
Compartilhar em outros sites

21 respostass a esta questão

Posts Recomendados

  • 0

O primeiro erro ocorreu na seguinte linha:

<input type="checkbox" name="P10_a" id="P10_a" value="checkbox" onclick= "javascript.resposta">
Olhe isto:
javascript.resposta
O correto seria:
resposta()
Ou javascript:resposta() Mas o fórum não permite escrever ! Portanto, escreverei só "resposta()", mas o funcionamento é o mesmo O navegador interpreta o código como javascript por padrão Agora os outros "erros" são questão de lógica ! Você pode fazer de maneira bem mais simples, caso já tenha utilizado Arrays O seu código HTML ficaria +/- assim:
Pergunta 10...<br>
<input type="checkbox" name="P10" id="P10" value="a" onclick= "resposta(this)" />Alternativa A (correta)<br>
<input type="checkbox" name="P10" id="P10" value="b" onclick= "resposta(this)" />Alternativa B<br>
<input type="checkbox" name="P10" id="P10" value="c" onclick= "resposta(this)" />Alternativa C<br>
<input type="checkbox" name="P10" id="P10" value="d" onclick= "resposta(this)" />Alternatica D<br>
<input type="checkbox" name="P10" id="P10" value="e" onclick= "resposta(this)" />Alternativa E<br>

Pergunta 11...<br>
<input type="checkbox" name="P11" id="P11" value="a" onclick= "resposta(this)" />Alternativa A<br>
<input type="checkbox" name="P11" id="P11" value="b" onclick= "resposta(this)" />Alternativa B<br>
<input type="checkbox" name="P11" id="P11" value="c" onclick= "resposta(this)" />Alternativa C (correta)<br>
<input type="checkbox" name="P11" id="P11" value="d" onclick= "resposta(this)" />Alternatica D<br>
<input type="checkbox" name="P11" id="P11" value="e" onclick= "resposta(this)" />Alternativa E<br>
E o JavaScript ficaria assim:
function resposta(elemento){
//Mensagens caso o usuário acerte a pergunta ou erro
correto="Você acertou !"
errado="Você errou !"
//Quantidade de perguntas
qtd_perguntas=11
//Array que armazena a resposta correta
respostas = new Array(qtd_perguntas-1)
respostas[10-1]="a"
respostas[11-1]="c"
//Número da pergunta atual
numero = parseInt(elemento.id.replace("P",""))
//Verifica se o usuário acertou a pergunta
if (elemento.value==respostas[numero-1]){
alert(correto)
}else{
alert(errado)
}
}

Não cheguei a testar, mas deve funcionar !

Qualquer coisa posta aí !

Link para o comentário
Compartilhar em outros sites

  • 0
Recebi sua mensagem

Mas evite enviar M.P. com dúvidas !

Poste aqui sua dúvida e mais membros poderão ajudá-lo

É isso mesmo! Mas achei que escrevendo ficaria ruim para chegar ao resultado final satisfatório. Mas vou tentar novamente: Na verdade são 102 perguntas e no caso basta mudar aqui qtd_pergunta=11 para 102?

O JavasScript está dessa forma:

<script language="javascript">

    function resposta (elemento) {

<!--Mensagem caso o usuário acerte a pergunta ou erro
    
    correto = "Você acertou !"
    errado = "Você errou !"
    
<!-- Quantidade de perguntas

    qtd_pergunta=11

<!--Array que armazena a resposta correta

    respostas = new Array(qtd_perguntas-1)
    respostas [10-11]="a"
    respostas [11-1] ="c"
    
<!--Número da pergunta atual

    numero = parseInt(elemento.id.replace("P",""))

<!-- Verifica se o usuário acertou a pergunta

    if (elemento.value==respostas[numero-1]){
    alert(correto)
    }else{
    alert(errado)
}
}
    

</script>
Vou colocar a 1ª e a 2ª pergunta como ficou:
<body>
1 - O orifício de entrada numa gástrula é denominado:
<br />

a)<input type="checkbox" name="P1" id="P1" value="a" onclick= "resposta(this)" />
arquêntero<br />

B)<input type="checkbox" name="P1" id="P1" value="b" onclick= "resposta(this)" /> blastocela<br />

c)<input type="checkbox" name="P1" id="P1" value="c" onclick= "resposta(this)" /> blastóporo <br />

d)<input type="checkbox" name="P1" id="P1" value="d" onclick= "resposta(this)" /> mesentoderma<br />

e)<input type="checkbox" name="P1" id="P1" value="e" onclick= "resposta(this)" /> cordomesoblasto</p>

<form id="form1" name="form1" method="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>

2 - O celoma é formado no:
<br /> 

a)<input type="checkbox" name="P2" id="P2" value="a" onclick="resposta(this)"/>ectoplasta <br />

B)<input type="checkbox" name="P2" id="P2" value="b" onclick="resposta(this)"/>endoderma <br />

c)<input type="checkbox" name="P2" id="P2" value="c" onclick="resposta(this)"/> ectoderma <br />

d)<input type="checkbox" name="P2" id="P2" value="d" onclick="resposta(this)"/> mesoderma <br />

e)<input type="checkbox" name="P2" id="P2" value="e" onclick="resposta(this)"/> blastoderma <br /></p>

<form id="form2" name="form2" metho[/d="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>
[/htmml]

Obs.: A resposta da pergunta 1 é a letra "c" e a resposta da 2 é a letra "d".
Digitando conforme o exemplo que você deu: 
[html]
c)<input type="checkbox" name="P1" id="P1" value="c" onclick= "resposta(this)" />
blastóporo Alternativa C (correta)<br />
Abrido a página aparece a alternativa e no final ....Alternativa C (correta) O intervalo de uma pergunta para outra digitei:
<form id="form2" name="form2" method="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>

Não funciona e desmarca a marcação do checkbox.

Primeiro, Jonathan Queiroz, quero te pedir desculpa.

Confesso que ainda não sei por que mas sei que estou errado. E eu já esperava!!

Não fiz outra coisa neste domingo todo, desde as 06:00 e ontem até (não sei bem mas foi até tarde) ficar aqui vendo códigos, fazendo alguns exemplos r repetindo outros. Depois de ver tantas coisas feitas por você resolvi deletar tudo que digitei do seu exemplo. Não sei se estou certo mas gosto de digitar os códigos e não cola-los. Mas dessa vez deletei o que digitei e colei o seu código.

E funcionou. Mas agora? onde errei?

Contudo, não espera a abertura de uma tela informando "Você acertou !" ou "Você errou !". Não daria para essa mensagem ficar do lado da questão?

Se não for possível não poderia limpar o "ckeckbox" depois de clicar em "Ok"? Recebo a mensagem "Você errou !" - clico "Ok" na janela da mensagem. Desmarco o "checkbox" recebo novamente a mensagem.

E o caso do botão "Próximo". Não poderia ter algo para iniciar sempre na Pergunta 1. Depois clicando no Botão “Próxima” vai para a 2ª pergunta.

Muito obrigado

Editado por Jonathan Queiroz
Link para o comentário
Compartilhar em outros sites

  • 0

Cara, você não deve desculpas a ninguém !

Não fez nada de errado...

Quanto ao código, vamos por partes !

Tem uma parte ali no código que está errada mesmo !

<script language="javascript">
    function resposta (elemento) {
<!--Mensagem caso o usuário acerte a pergunta ou erro
    correto = "Você acertou !"
    errado = "Você errou !"
<!-- Quantidade de perguntas
    qtd_pergunta=11
<!--Array que armazena a resposta correta
    respostas = new Array(qtd_perguntas-1)
    respostas [10-11]="a"
    respostas [11-1] ="c"
<!--Número da pergunta atual
    numero = parseInt(elemento.id.replace("P",""))
<!-- Verifica se o usuário acertou a pergunta
    if (elemento.value==respostas[numero-1]){
    alert(correto)
    }else{
    alert(errado)
}
}
</script>
O problema está no comentários ! Comentários em JavaScript não são feitos assim ! Tente utilizar o // no começo das linhas que você deseja comentar ! Outro erro ocorre porque você deixou a quantidade de perguntas em 11, mas na verdade são 112 perguntas ! O correto seria:
qtd_pergunta=112
Além disso, no código você ainda não definiu a resposta correta de cada questão O certo seria:
respostas [0]="a"
respostas [1] ="c"
[...continua...]
Mas lembre-se de que os arrays começam em zero no JavaScript Por exemplo, respostas[0] se refere à pergunta número 1 (0+1=1), a respostas[1] se refere à pergunta número 2 (1+1=2), etc. Também existe outro problema no seu código HTML Observe:
<form id="form2" name="form2" metho[/d="post" action="">
O correto seria:
<form id="form2" name="form2" method="post" action="">

Não daria para essa mensagem ficar do lado da questão?

Se não for possível não poderia limpar o "ckeckbox" depois de clicar em "Ok"? Recebo a mensagem "Você errou !" - clico "Ok" na janela da mensagem. Desmarco o "checkbox" recebo novamente a mensagem.

E o caso do botão "Próximo". Não poderia ter algo para iniciar sempre na Pergunta 1. Depois clicando no Botão “Próxima” vai para a 2ª pergunta.

Isso tudo também é possível, mas vamos primeiramente colocar pra funcionar a parte mais "básica" !

Depois que conseguirmos isso poderemos ir aprimorando o script

Link para o comentário
Compartilhar em outros sites

  • 0

Bem o JavaScript ficou assim:

<script language="javascript">

function resposta(elemento){

//Mensagens caso o usuário acerte a pergunta ou erro

correto="Você acertou !"
errado="Você errou !"

//Quantidade de perguntas

qtd_perguntas=102

//Array que armazena a resposta correta

respostas = new Array(qtd_perguntas-1)
respostas[0]="e"
respostas[2]="c"
respostas[3]="b"
respostas[4]="b"
respostas[5]="c"
respostas[6]="c"
respostas[7]="c"

//Número da pergunta atual

numero = parseInt(elemento.id.replace("P",""))

//Verifica se o usuário acertou a pergunta

if (elemento.value==respostas[numero-1]){
alert(correto)
}else{
alert(errado)
}
}

</script>
Estou clicando na letra "e" da checkbox da Pergunta 1 e abre a janela informado "Você acertou !". (0+1=1) pergunta 1 - Arrays. Correto? Com relação ao "form" deve ter sido na hora de colocar aqui. No html esta conforme abaixo mas não funciona. No internavo de cada pergunta coloquei um. Como comentei a idéia é que abra na 1ª (primeira) pergunta depois vai clicando nesse botão "Próxima" e vai para a proxima pergunta.
<form id="form2" name="form2" method="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>

Se obervar que não estou aqui não é falta de interese não. É que aqui está armando um temporal e ficar com computador ligado é um risco.

Obrigado pela atenção.

Link para o comentário
Compartilhar em outros sites

  • 0

A idéia é:

Ao abrir o página abre logo na Pergunta 1 (que tem 5 questões). Clicando no Botão - "Próxima", sai da página da 1ª pergunta e vai para a da 2 Pergunta. E por dinate atá a pergunta 102. Mas depois da 1 pergunta 1 teria que ter um Botão "Retornar". Correto?

Não sei bem mas seria igua aqueles Botões |>| Proxima e |<| Retornar.

Acho que você que não estou sabendo explicar legal. Qual é o mais usual nas páginas.

Seria "Proxima" e "Retorno"%3roxima" e "Retorno"?

Obrigado

Link para o comentário
Compartilhar em outros sites

  • 0

Nesse caso recomendaria que você colocasse todas as perguntas nessa página !

Quanto a deixar a mensagem ao lado da resposta você pode tentar fazer algo como:

<form id="form1" name="form1" method="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>

2 - O celoma é formado no: (<span id="mensagem2" class="mensagem"></span>)
<br /> 

a)<input type="checkbox" name="P2" id="P2" value="a" onclick="resposta(this)"/>ectoplasta <br />

B)<input type="checkbox" name="P2" id="P2" value="b" onclick="resposta(this)"/>endoderma <br />

c)<input type="checkbox" name="P2" id="P2" value="c" onclick="resposta(this)"/> ectoderma <br />

d)<input type="checkbox" name="P2" id="P2" value="d" onclick="resposta(this)"/> mesoderma <br />

e)<input type="checkbox" name="P2" id="P2" value="e" onclick="resposta(this)"/> blastoderma <br /></p>

<form id="form2" name="form2" metho[/d="post" action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>
E o JS ficaria assim:
<script language="javascript">

function resposta(elemento){

//Mensagens caso o usuário acerte a pergunta ou erro

correto="Você acertou !"
errado="Você errou !"

//Quantidade de perguntas

qtd_perguntas=102

//Array que armazena a resposta correta

respostas = new Array(qtd_perguntas-1)
respostas[0]="e"
respostas[2]="c"
respostas[3]="b"
respostas[4]="b"
respostas[5]="c"
respostas[6]="c"
respostas[7]="c"

//Número da pergunta atual

numero = parseInt(elemento.id.replace("P",""))

//Verifica se o usuário acertou a pergunta
x=document.getElementById("mensagem"+numero)
if (elemento.value==respostas[numero-1]){
x.innerHTML=correto
x.style.color="blue"
}else{
x.innerHTML=errado
x.style.color="red"
}
}

</script>

Link para o comentário
Compartilhar em outros sites

  • 0

Funcionou, a mensagem aparece do lado da pergunta.

Eu coloquei só para ver a (<span id="mensagem1" class="mensagem"></span>)<br /> do lado da pergunta. Tudo bem ela aparece também mas se colocar uma em cada pergunta ai fica tudo doido.

Será que se criasse uma variável onde a "span" correta ficaria sempre do lado da resposta certa e a "span" da questão errada ficaria sempre do lado dessa "span" chamando e mansagem "Você Errou! não funcionaria do lado das questões? Muito obrigado.

O botão próxima funciinou também mas deve ter colocar algo para ir para a pergunta 2.

Estava colocando tudas as perguntas e respostas dentro da "div" mas tirei tudos para entrar com esse código novo.

Muito obrigado que Deus te ajude sempre

Link para o comentário
Compartilhar em outros sites

  • 0

Alberto, evite enviar dúvidas por M.P., por dois principais motivos:

  • 1. Diminui a sua chance de conseguir resposta, já que, ao postar sua dúvida no fórum, vários membros poderão respondê-la.Por M.P.
  • 2. Se a dúvida for respondida pelo fórum, a solução será visível a todos, ajudando pessoas com o mesmo problema

Por esses motivos, postarei a mensagem aqui no fórum para que todos tenham acesso

O checkbox está permitido clicar em mais de um. Não deria ficar naquela condição, ou seja, so posso marcar um de cada vez. Marca um, marcando outro desmarca aquele. Só pode marcar um.

No lugar de checkbox você pode utilizar radio buttons

O código JavaScript será o mesmo, só muda o HTML

Ao invés de:

a)<input type="checkbox" name="P2" id="P2" value="a" onclick="resposta(this)"/>ectoplasta <br />
Seria:
a)<input type="radio" name="P2" id="P2" value="a" onclick="resposta(this)"/>ectoplasta <br />

Link para o comentário
Compartilhar em outros sites

  • 0

Ficou cem porcento com o "radio".

Com relação a "div" sugerida, coloquei. Através dessa "div" que será trabalhado o botão "Próxima"? Terá apenas um Botão "Proxima" ou um em cada intervalo de uma pergunta para outra?

O codigo com a "div" ficou dessa forma:

<div id="Layer1">1 - Em outubro de 1945, um mês após o fim da Segunda GuerraMundial, Getúlio foi derrubado. Seu substituto foi : (<span id="mensagem1" class="mensagem"></span>)<br />

a)<input name="P1" type="radio" id="P1"  onclick= "resposta(this)" value="a" />
Juscelino Kubitschek <br />

B)<input type="radio" name="P1" id="P1" value="b" onclick= "resposta(this)" />
Carlos Lacerda<br />

c)<input type="radio" name="P1" id="P1" value="c" onclick= "resposta(this)" />
Golbery de Couto e Silva<br />

d)<input type="radio" name="P1" id="P1" value="d" onclick= "resposta(this)" />
Jânio Quadros<br />

e)<input type="radio" name="P1" id="P1" value="e" onclick= "resposta(this)")/>
Eurico Gaspar Dutra E </div>
O código do Botão:
<form id="form1" name="form1" method="post" action="action="">
<label>
<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
</label>
</form>

Link para o comentário
Compartilhar em outros sites

  • 0

Já que você vai deixar todas as questões na mesma página, pode fazer de maneira mais simples !

Primeiramente, mude o seu botão

Ao invés de:

<input name="Proxima" type="submit" id="Proxima" value="Próxima" />
Ficará assim:
<input name="Proxima" type="button" id="Proxima" value="Próxima" />
Dessa forma, ao clicar o botão, o formulário não será enviado depois disso utilize o método focus() do formulário seguinte
<input name="Proxima" type="button" id="Proxima" value="Próxima" onlick="document.proximo_formulario.focus()"/>

Qualquer dúvida posta aí !

Link para o comentário
Compartilhar em outros sites

  • 0

Jonathan,

Não seria bem assim. Tenho muito dificuldade de colocar...o que realmente estou vendo e o que espero de saia. Em 31/01/09 às 18:57 informei: "E o caso do botão "Próximo". Não poderia ter algo para iniciar sempre na Pergunta 1. Depois clicando no Botão “Próxima” vai para a 2ª pergunta.Muito obrigado".

Depois disso veio o entendimento que colocando uma "div" iria permitir fazer o tal botão funcionar.

Agora coloquei o código que você sugeriu logo depois da "div" da 1 pergunta da ultima questão, porém nada aconteceu. O código:

<input name="Proxima" type="button" id="Proxima" value="Próxima" onlick="document.proximo_formulario.focus()"/>
Como está o códugo html agora:
<div id="Layer1">1 - No periodo 195-1964 como se chamava o serviço secreto: (<span id="mensagem1" class="mensagem"></span>)<br />

a)<input name="P1" type="radio" id="P1"  onclick= "resposta(this)" value="a" />
SNI <br />

B)<input type="radio" name="P1" id="P1" value="b" onclick= "resposta(this)" />
ABIN<br />

c)<input type="radio" name="P1" id="P1" value="c" onclick= "resposta(this)" />
SSI<br />

d)<input type="radio" name="P1" id="P1" value="d" onclick= "resposta(this)" />
DI<br />

e)<input type="radio" name="P1" id="P1" value="e" onclick= "resposta(this)")/>
SFICI  E</div>

Aqui Colquei o Botão.

Bem é isso: O código todo está assim agora. Uma "div" e dentro dessa "div" as perguntas e questões uma seguida da outra. Entre a pergunta 1 e a 2 coloquei o Botão que você indicou.

Se abrir sempre na página da pergunta 1 com as questões e colocar um Botão para ir para a "Próxima" pergunta seria o ideal. Estou procurando mas ainda não achei algo do tipo "function AbrirPagina <!-- obriga sempre abrir na página 1". Já vi isso!

Obrigado

Link para o comentário
Compartilhar em outros sites

  • 0

dae pessoal,

to caindo de paraquedas aqui,

talvez minha sugestao não se encaixe no problema.

AlbertoRT, se você colocar uma div pra cada pergunta,

então o q você precisa fazer é ocultar todas as divs e mostrar apenas 1 por vez.

assim fica tudo na mesma pagina.

o seu botao proxima pagina, na verdade não vai mudar a pagina,

ele vai apenas ocultar a div atual e exibir a proxima div.

procure por display e hidden.

sucesso ai.

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...