Dúvida com if - grid system bootstrap
Bom dia. Tenho esse programa que gera matrizes no Grid System do Bootstrap, no qual digitando um número <=12 a matriz gerada mostra uma coluna correspondente ao valor dado em n, e a outra correspondente ao valor que falta para chegar a 12. Tenho duas dúvidas aparentemente simples: A primeira é que ao colocar n =12, quero que só apareça uma coluna. No código abaixo dá certo, mas queria um if mais apropriado que essa gambiarra. Segundo, queria uma forma de imprimir mais colunas até que zere quando chegar ao valor de 12 . de forma que eu não precise criar mais variáveis para isso. Aqui tem um exemplo de resultado com n = 3. (12 - 3 = 9)
<html>
<div class="container">
<div class="numerocolunas"></div>
<input placeholder="Valor de X:" id="x" />
<button id="gerar">Gerar</button>
<div class="row" id="arrays">
<div class="col-md-6"></div>
<div class="col-md-6"></div>
</div>
</div>
</html>
<script>
function gerarNumeros() {
var x = document.getElementById("x");
var container = document.getElementById("arrays");
var n = parseInt(x.value);
container.innerHTML = '';
var X = n;
var Y = 12 - X;
if (X == 12) {
// MUDAR ESSE IF
//container.innerHTML += '<div class="col-md-' + X + '">col-md-' + X + '</div>';
} else {
container.innerHTML += '<div class="col-md-' + X + '">col-md-' + X + '</div>';
container.innerHTML += '<div class="col-md-' + Y + '">col-md-' + Y + '</div>';
}
}
document.getElementById("gerar").addEventListener("click", gerarNumeros)
</script>
Discussão (1)
Carregando comentários...