Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] Dessa forma proposta o meu if não funciona, não consegui encontrar o erro

Referente ao curso Lógica de programação: praticando com desafios

por Homaestefani
| 6.5k xp | 2 posts

No caso, o botão não executa nenhuma ação ao clicar. Antes eu havia testado com outra condição como o nome "Alugar" e "Devolver" e deu certo, ou seja, o problema está nesse contains.

function alterarStatus(numberGame){

function alterarStatus(numberGame){

let gameNow = document.getElementById(`game-${numberGame}`);
let botton = (gameNow.querySelector('.dashboard__item__button'));
let image = (gameNow.querySelector('.dashboard__item__img'));

if (image.classList.contains('dashboard__item__img--rented')) {

    botton.textContent = 'Alugar';
    botton.classList.remove('dashboard__item__button--return');
    image.classList.remove('dashboard__item__img--rented'); 
    
} else {

    botton.textContent = 'Devolver';
    botton.classList.add('dashboard__item__button--return');
    image.classList.add('dashboard__item__img--rented');
}

}

Matricule-se agora e aproveite até 50% OFF

O maior desconto do ano para você evoluir com a maior escola de tecnologia

QUERO APROVEITAR
1 resposta
solução!
por Armano Barros Alves Junior
| 4785k xp | 10261 posts
Alura Scuba Team Analista de Suporte Educacional II

Olá, Homaestefani!

O problema pode estar relacionado ao uso do método contains da classe classList. Esse método verifica se um elemento possui uma determinada classe. Se o botão não está respondendo ao clique, pode ser que a classe dashboard__item__img--rented não esteja presente no elemento image no momento em que a função é chamada.

Aqui estão algumas coisas que você pode verificar:

  1. Verifique se a classe está presente inicialmente: Certifique-se de que a classe dashboard__item__img--rented está realmente presente no elemento image antes de executar a função. Você pode fazer isso inspecionando o elemento no navegador.

  2. Eventos de clique: Verifique se o evento de clique está corretamente associado ao botão. A função alterarStatus precisa ser chamada quando o botão é clicado. Isso geralmente é feito com algo como:

    botton.addEventListener('click', function() {
    alterarStatus(numberGame);
});

    Certifique-se de que essa associação está acontecendo no seu código.

  3. Erros no console: Abra o console do desenvolvedor no seu navegador (geralmente pressionando F12) e veja se há algum erro sendo exibido. Isso pode dar pistas sobre o que está acontecendo.

  4. Verifique o escopo das variáveis: Certifique-se de que gameNow, botton, e image estão sendo corretamente atribuídos e que numberGame tem o valor esperado.

Espero que essas dicas te ajudem a encontrar o problema! Se precisar de mais alguma coisa, estou por aqui.

Bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.