Ola!
if (de > ate) {
alert('O número inicial não pode ser maior que o final!');
return reiniciar();
}
O que está acontecendo:
A função reiniciar() provavelmente altera o estado dos botões (por exemplo, desativa o botão "Reiniciar" e ativa o botão "Sortear").
Quando você chama reiniciar() dentro de outro trecho de código, o botão é atualizado visualmente, mas fora do fluxo normal da aplicação.
Dependendo de como o código está estruturado, ele pode:
- ser reativado antes de terminar a execução do restante da função;
- ou não respeitar o estado inicial configurado no carregamento da página (por exemplo, via CSS ou script).
Em resumo: return reiniciar() não é o fluxo pensado pelo código original — o “bug estético” vem justamente do fato de estar forçando uma função que controla o estado visual fora do contexto correto.
Como corrigir corretamente
Você pode apenas interromper a execução da função sem chamar reiniciar(), assim:
if (de > ate) {
alert('O número inicial não pode ser maior que o final!');
return; // apenas sai da função, não chama reiniciar
}
Dessa forma:
- A mensagem é exibida;
- A função atual é interrompida;
- O botão "Reiniciar" mantém o comportamento normal, definido no restante do código.
Caso queira realmente reiniciar:
Se sua intenção for resetar tudo quando o usuário erra (inclusive limpar os campos e voltar ao estado inicial), então é melhor chamar a função reiniciar() após o alerta, mas sem usar return, por exemplo:
if (de > ate) {
alert('O número inicial não pode ser maior que o final!');
reiniciar();
return; // só depois de reiniciar, interrompe a função
}
Assim:
- O alerta é mostrado,
- O sorteador é reiniciado corretamente,
- A execução é encerrada sem prosseguir para a parte do sorteio.
Se quiser, posso te mostrar exatamente como o estado do botão está sendo alterado e como garantir que ele volte a ficar desativado basta me mostrar o trecho da função reiniciar() e onde o botão é controlado.