1

estoy intentando hacer un cuestionario que al dar click en el radio button pase a la siguiente pregunta, pero tengo un detalle con el contador y me imprime la pregunta 5 después de la 1, les agradezco mucho si me pueden ayudar con esta duda, gracias.

$(document).ready(function() {

    //Muestra y oculta div's y botón

    $("#div1").show();

    $("#div2,#div3,#div4,#div5").hide();
    $("#btnenvia").hide();

    $("input[type=radio]").click(function(event) {

        var valor = $(event.target).val();

        var int = 1;

        while (int <= 5) {
           //Aquí comparo que el valor de **value** de los radiobutton sea diferente de 0
            if (valor != 0) {
                $("#div" + (int - 1)).hide();
                $("#div" + (int)).show(1000);
            }
            //muestra boton de envia cuando el contador llegue a 5
            int++;
            if (int == 5) {
                $("#btnenvia").show();
            }
        }
    });

});

1 respuesta 1

3

Lo que pasa es que estás acumulando el contador dentro del mismo while, lo que lo hace que se resetee cada vez que se ejecuta (y por ende va de 1 al 5 sin detener)

Puedes revisar este ejemplo que creo que hace lo que buscas (aunque cambiando el radio por un boton por conveniencia)

$(document).ready(function() {
    var contador = 1;
    //Muestra y oculta div's y botón

    $("#div1").show();

    $("#div2,#div3,#div4,#div5").hide();
    $("#btnenvia").hide();

    $("input[type=button]").click(function(event) {

        var valor = $(event.target).val();

        var int = 0

        while (int <= contador) {
            if (valor != 0) {
                $("#div" + (int)).hide();
            }
            //muestra boton de envia cuando el contador llegue a 5
            int++;
            if (int == 5) {
                $("#btnenvia").show();
            }
        }
        contador++;
        $("#div" + (int)).show(1000);
    });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1"> Div 11 </div>
<br>
<div id="div2"> Div 2 </div>
<br>
<div id="div3"> Div 3 </div>
<br>
<div id="div4"> Div 4 </div>
<br>
<div id="div5"> Div 5 </div>
<br>
<input type="button" value="algo">

2
  • Te lo agradezco, me funciono muy bien para lo que estaba haciendo, además si lo adapte con los radiobuttons, gracias!
    – omarhl107
    el 19 jun. 2018 a las 21:28
  • Si te funcionó agradeceria que lo marques como respuesta aprovada con la palomita verde. :)
    – Killbunny
    el 19 jun. 2018 a las 21:37

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.