Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

sugestão de mudança no projeto.

com o código feito na aula, ao clicar seguidamente em sortear, o botao reiniciar ficava mudando para ativo e inativo mesmo que n o usasemos. por isto fiz umas mudanças no código para que ele mude apenas quando

1º apertar sortear uma vez ele vai de inativo para ativo.

2º ao clicar no botão sortear novamente se o botão estiver ativo ele n muda mais para inativo.

3º ao clicar no botão reiniciar ele reinicia normalmente.

function sortear(){
    let quantidade = parseInt(document.getElementById('quantidade').value);
    let de = parseInt(document.getElementById('de').value);
    let ate = parseInt(document.getElementById('ate').value);

    let sorteados = [];
    let numero;

    for (let i=0; i <quantidade; i++) {
        numero = obterNumeroAleatorio(de, ate);

            while (sorteados.includes(numero)){
                numero = obterNumeroAleatorio(de, ate);
            }

        sorteados.push(numero);
    }

    let resultado = document.getElementById('resultado');
        resultado.innerHTML = `<label class="texto__paragrafo">Números sorteados: ${sorteados}</label>`;

    alterarStatusBotao();
}

function obterNumeroAleatorio(min, max) {
    return Math.floor(Math.random() * (max - min +1)) + min;
}

let botao = document.getElementById('btn-reiniciar');

function alterarStatusBotao() {
    
    if (botao.classList.contains("container__botao-desabilitado")) {
        botao.classList.remove("container__botao-desabilitado");
        botao.classList.add("container__botao");
    }
}

function alterarStatusBotaoInativo() {
    if (botao.classList.contains('container__botao')) {
        botao.classList.remove('container__botao');
        botao.classList.add('container__botao-desabilitado');

    }
}

function reiniciar() {
    document.getElementById('quantidade').value ='';
    document.getElementById('de').value ='';
    document.getElementById('ate').value ='';
    document.getElementById('resultado').innerHTML = '<label class="texto__paragrafo">Números sorteados:  nenhum até agora</label>';
    alterarStatusBotaoInativo();
}
1 resposta
solução!

Oi, Tairone! Como vai?

Do jeito que você explicou, sua lógica para evitar que o botão fique alternando entre ativo e inativo faz sentido e deixa o comportamento mais claro para quem usa o projeto. A separação entre alterarStatusBotao() e alterarStatusBotaoInativo() torna o fluxo fácil de acompanhar.

Uma dica interessante para o futuro é usar o método classList.toggle() quando quiser alternar estados de forma simples. Veja este exemplo:


function alternar() {
    let btn = document.getElementById('btn');
    btn.classList.toggle('ativo');
}

Esse código ativa ou desativa a classe ativo automaticamente.

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!