2

¡Hola! Tengo el siguiente código y parece que funciona como debe, excepto cuando se quiere imprimir el número de guiones. El proposito del programa es que se ingrese un número entre 2 y 50 y dichos ingresos permitirán dibujar una línea compuesta por guiones. En este caso la línea tendrá tantos guiones como el número ingresado, pero parece que al ingresar 50 como máximo valor, me imprime dos guiones y así sucesivamente hasta llegar al número 2 (si el número ingresado es 2, pareciera que imprime 50 guiones). Todo al revés en vez de imprimir la cantidad correspondiente por el número ingresado.

Les puedo dejar el código como referencia:

let ingreso = 2;    
$("#btnIngresar").click(mostrarLinea);
function mostrarLinea(){
    ingreso = Number($("#txtIngreso").val());
    while(ingreso <= 50){
        $("#pResultado").append(`-`);
        ingreso++;
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="txtIngreso">Ingresar número:</label>
<input type="text" id="txtIngreso">
<input type="button" value="Ingresar" id="btnIngresar">
<p id="pResultado"></p>

1
  • ¿Al ingresar un nuevo valor debe sumarse al actual o debe dibujar nuevamente la linea con el numero ingresado?, es decir, ¿si ingreso un 25 y luego un 5, al final debe dibujar una linea con 30 o solo los 5 ingresados al final? el 6 may. 2020 a las 22:34

3 respuestas 3

3

La condición que habías establecido provocaba que dado el número ingresado se pintarían tantos guiones como 50 - número ingresado. La maneras más sencilla de trabajar con bucles que sabemos el número de veces que se van a recorrer es a través de un bucle for.

De esta manera podemos hacer que el bucle se repita tantas veces como el número ingresado indique. Añadí una condición de salida de la función para el caso de que el número sea menor que 2 o mayor que 50.

let ingreso = 2;

$("#btnIngresar").click(mostrarLinea);

function mostrarLinea() {
    ingreso = Number($("#txtIngreso").val());
    
    //Vaciamos el párrafo para que no se sume al texto del resultado anterior
    $("#pResultado").empty();
    
    //Establecemos la condición de salida en caso de que el número no esté en el rango requerido
    if (ingreso < 2 || ingreso > 50) {
    	$("#pResultado").append('Número ingresado está fuera de rango');
      return false;
    }
    
    for (let i = 0; i < ingreso; i++) {
        $("#pResultado").append(`-`);
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
    <label for="txtIngreso">Ingresar número:</label>
    <input type="text" id="txtIngreso">
    <input type="button" value="Ingresar" id="btnIngresar">
    <p id="pResultado"></p>
</body>

1
  • ¡Muchísimas gracias por la respuesta rápida! Espero que perdones mi tardanza.
    – disabled
    el 9 may. 2020 a las 20:24
2

No es necesario crear un ciclo, para eso está la función .padEnd(); proporcionas la longitud de cadena y el caracter que debe agregar:

let ingreso = 2;    
$("#btnIngresar").click(mostrarLinea);
function mostrarLinea(){
    ingreso = parseInt($("#txtIngreso").val());
    if(ingreso < 2 || ingreso > 50) {
        console.log('No permitido');
    } else {
        $("#pResultado").append(''.padEnd(ingreso, '-'));
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="txtIngreso">Ingresar número:</label>
<input type="text" id="txtIngreso">
<input type="button" value="Ingresar" id="btnIngresar">
<p id="pResultado"></p>

0

El problema está en que estas aumentando la variable ingreso en el bucle y si la variable era menor que 50 pues la condición del while era cierta y no salía del bucle hasta que ingreso fuera mayor o igual que 50.

Tienes que crear una variable local i para controlar el número de repeticiones.

let ingreso = 2;

$("#btnIngresar").click(mostrarLinea);
function mostrarLinea(){
    ingreso = Number($("#txtIngreso").val());
    let i = 0;
    let guiones = '';
    if (ingreso >= 2 && ingreso <= 50) {
        while(i < ingreso){
           guiones += '-';
        i++;
        }
      $("#pResultado").append(guiones);
    }
    else {
        alert('Numero debe estar entre 2 y 50')
    }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="txtIngreso">Ingresar número:</label>
 <input type="text" id="txtIngreso">
 <input type="button" value="Ingresar" id="btnIngresar">
 <p id="pResultado"></p>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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