1
resposta

sugest]ap de melhoria no pojeto para botão reiniciar

Existe uma inconsistencia no botão reiniciar que ao clicar duas vezes no botão sortear o botão reinciar desativa e ativa novamente, Realizei o ajuste adicinando duas funções com a seguinte sintaxe:

function ativarBotaoReiniciar() {
    let btReiniciar = document.getElementById('btn-reiniciar');
    btReiniciar.classList.remove('container__botao-desabilitado');
    btReiniciar.classList.add('container__botao');

    // Adiciona evento para desativar ao clicar
    btReiniciar.onclick = function () {
        desativarBotaoReiniciar();
        // aqui você pode chamar a função de reinício, se houver
    };
}
function desativarBotaoReiniciar() {
    let btReiniciar = document.getElementById('btn-reiniciar');
    btReiniciar.classList.remove('container__botao');
    btReiniciar.classList.add('container__botao-desabilitado');

    // Remove o evento para evitar múltiplos cliques
    btReiniciar.onclick = null;
}

a função ativarBotaoReiniciar() é declarada ao final da função sortear.

link Projeto gameSorteioNumero

1 resposta

Oi, Luden! Como vai?

Agradeço por compartilhar seu código com a comunidade Alura.

Você organizou bem as funções de ativar e desativar o botão, e a ideia de manipular as classes com classList é eficiente nesse cenário. Parabéns!

Uma dica interessante para o futuro é usar o disabled direto no botão, além da classe, para evitar que ele seja clicado quando não deveria. Veja este exemplo:


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

Esse código usa disabled = true para impedir o clique no botão. Isso torna o comportamento mais previsível e reduz possíveis conflitos visuais com classes.

Conteúdos relacionados

O link da documentação abaixo, está em inglês, mas você poderá utilizar a tradução automática do navegador.

Qualquer dúvida que surgir, compartilhe no fórum. Abraços e bons estudos!

Alura

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