Cajas dinámicas

<h2>Cajas dinámicas</h2>
            <input type="number" class="form-control" id="cajas" min="1" max="10" value="2">
            <input class="btn btn-info boton" type="button" id="crear"  value="Crear">
            <div id="res">

            </div>
            <input class="btn btn-info boton" type="button" id="sumar"  value="Sumar">
       
$(function () {
    $('#crear').click(function () {
        var n = Number($('#cajas').val());
        $('#res').empty();
        for (var i = 0; i < n; i++) {
            $('#res').append('<input type="number" id="valor' + i + '" value="1" ><br/>');
        //    $('#res').append("<input type=\"number\" id=\"valor" + i + "\" value=\"1\" ><br/>");
        }
    });
    $('#sumar').click(function () {
        var n = Number($('#cajas').val());
        var suma = 0;
        for (var i = 0; i < n; i++) {
            suma += Number($('#valor' + i).val());
        }
        $('#res p').remove();
        $('#res').append("<p>La suma es: "+suma+"</p>");
    });
});

Publicado por

Juan Pablo Fuentes

Formador de programación y bases de datos