Jump to content

Question

Ola pessoal, alguém tem algum código javascript ou pode me dar algum link como referencia que tenha um questionario/quiz que use arrays e estruturas de repetição?

 

 

Share this post


Link to post
Share on other sites

1 answer to this question

Recommended Posts

  • 0

Segue exemplo:

 

CÓDIGO

<!doctype html>
<html lang="pt-BR">
	<head>
		<meta charset="utf-8"/>
		<title>Quiz</title>
		
		<script type="text/javascript">
			function verificar() {
				var acertos = 0;
				var erros = 0;

				for (var p = 0; p < perguntas.length; p++) {
					var resposta = document.getElementsByName('res' + p);

					for (var alt = 0; alt < resposta.length; alt++) {
						if (resposta[alt].checked && resposta[alt].value == perguntas[p][1]) {
							acertos++;
							document.getElementById('L' + p).style = "color: #00FF00;";
						}

						if (resposta[alt].checked && resposta[alt].value != perguntas[p][1]) {
							erros++;
							document.getElementById('L' + p).style = "color: #FF0000;";
						}
					}
				}

				document.getElementById('acertos').style = "visibility: visible;";

				if (acertos == 0) {
					document.getElementById('mensagem').innerHTML = "<strong>Infelizmente você errou todas as questões! :(</strong>";
				}
				else if (acertos == 1) {
					document.getElementById('mensagem').innerHTML = "<strong>Pelo menos você acertou " + acertos + " questão. :)</strong>";
				}
				else if (acertos > 0 && acertos < perguntas.length) {
					document.getElementById('mensagem').innerHTML = "<strong>Você acertou " + acertos + " questões e errou " + erros + " questões!</strong>";
				}
				else {
					document.getElementById('mensagem').innerHTML = "<strong>PARABÉNS! Você acertou todas as " + acertos + " questões!</strong>";
				}
			}
		</script>
	</head>

	<body>
		<h1>Responda as Perguntas</h1>

		<script type="text/javascript">
			var perguntas = [
				["O planeta Terra possui dois satélite natural.", "F"],
				["O maior satélite natural do Sistema Solar é Ganimedes, lua do planeta Netuno.", "F"],
				["O planeta que apresenta maior quantidade de satélites é Júpiter (63 satélites naturais).", "V"],
				["Segundo estudos de astrofísicos, o Sistema Solar nasceu a, aproximadamente, 4,6 bilhões de anos.", "V"],
				["A estrela mais próxima do Sistema Solar é Centauri, distante cerca de 4,22 anos-luz. Ela está localizada no sistema Alpha Centauri.", "V"],
				["O planeta do Sistema Solar que está mais próximo do Sol é Mercúrio. Mercúrio é também o menor planeta do sistema solar e sua temperatura na superfície pode atingir 420ºC.", "V"],
				["Marte é o planeta mais próximo da Terra.", "V"]
			];
		
			document.write("<ol>");

			for (var linha = 0; linha < perguntas.length; linha++) {
				document.write("<li id='L" + linha + "'>" +perguntas[linha][0]+ "</li>");
				document.write("<input type='radio' name='res" + linha + "' id='v" + linha + "' value='V' /> <label>VERDADEIRO</label> <br/>");
				document.write("<input type='radio' name='res" + linha + "' id='f" + linha + "' value='F' /> <label>FALSO</label>");
			}

			document.write("</ol>");
		</script>

		<button id="enviar" onclick="verificar();">Enviar</button>

		<div id="acertos" style="visibility: hidden;">
			<p id="mensagem" style="font-size: 2em;"></p>
		</div>
	</body>
</html>

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Carlos Web Soluções Web
      Olá pessoal !!
      Estou desenvolvendo um menu em CSS, e eu gostaria de colocá-lo no CSS Responsive:
       
      @media screen and (max-width: 800px) {
      }
       
      O link do menu de como está atual se encontra em:
      MENU Link

      e o que eu desejo alcançar é:
      MENU RESPONSIVE

      Por favor me ajudem.....abraço !!
    • By lordstarlight
      Olá galera,
       
      Tenho um código que abre uma janela modal clicando num botão .
      Como faço para adaptar esse código para abrir usando um <input type="image" ... ?
       
      Abraço !!!
      <script type="text/javascript"> $('#myModal').on('shown.bs.modal', function () { $('#myInput').trigger('focus') }) </script> <!-- Modal --> <div id="myModal" class="modal fade" role="dialog"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Janela Modal</h4> </div> <div class="modal-body"> <p>Texto<br> Mais Texto<br> </p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> <!-- --> <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>  
    • By Ewfc2005
      Eu sou um programador amador, e ainda estou aprendendo programação, comecei um site, mas esqueci de faze-lo para ser responsivo, agora preciso de ajuda
      pois nao consigo deixa-lo responsivo
       

      Codigo HTML
       
      Codigo CSS

       
       
      Ele está mal feito, ainda tenho que arrumar muita coisa, se alguem conseguir me ajudar e dizer como ele pode ficar responsivo
      eu Agradeço.
    • By asacap1000
      Galera me ajudem por favor, estou pirando kkkkk
       
      Seguinte, tenho um form que realiza o submit via javascrit enviando os dados para uma página php formatada em json.
      Está gravando perfeitamente porém preciso dos dados do retorno, como Link do boleto, e alguns outros resultados para inserir no banco nesse ponto já pesquisei um monte testei de tudo até a página bugar e nada kkkk
       
      o Script que utilizo para o envio é esse:
       
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $("#frmBoleto").submit(function(){ $.ajax({ type: "POST", url: "https://www.sitedaloja.com.br/action/boleto_bradesco/gerando_boleto.php", data: $(this).serializeArray(), }).done(function( msg ) { }); return false; }); </script> Como fazer para capturar os dados  da resposta do json?  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.