Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Problema simples com FOR - javascript

por Petrus Henrique Soares de Melo
| 77.3k xp | 10 posts
var abrirAgenda = document.getElementsByClassName('ver-mais-agenda');
for (var i = 0; i < abrirAgenda.length; i++){
        var detalhesAgenda = document.getElementsByClassName('detalhesAgenda')[i];
        var postAgenda = document.getElementsByClassName('post-agenda')[i];
        var buttomPlus = document.getElementsByClassName('fa-plus')[i];
        abrirAgenda[i].onclick = function() {
            alert(detalhesAgenda.textContent);  
            return false;
        }  
    }

pessoal, to com um problema que não to conseguindo resolver. Por alguma coisa tosca do destino esse alert(detalhesAgenda.textContent) só está alertando o vetor na posição 4, independente do abrirAgenda que eu clicar. Realmente não sei oq tá errado. Já fiz outras coisas desse tipo exatamente dessa forma e funcionou, e esse por algum bug estranho não ta funfando.

3 respostas
por Carlos Pereira Dias
| 527.3k xp | 54 posts

Quantos elementos a variável 'abrirAgenda' recebe?

solução!
por FELIPE BELINE
| 151.8k xp | 1 posts

Olá,

Isto esta acontecendo pois quando o evento onclick é chamado ele utilizará o valor atual da variável detalhesAgenda. Lembrando que javascript cria um escopo léxico apenas com funções. (logo a variável detalhesAgenda continua acessível no seu contexto e com o ultimo valor passado para ela).

Caso você queira fazer este código funcionar basta fazer o seguinte: 

var abrirAgenda = document.getElementsByClassName('ver-mais-agenda');
for (var i = 0; i < abrirAgenda.length; i++){
    var detalhesAgenda = document.getElementsByClassName('detalhesAgenda')[i];
    var postAgenda = document.getElementsByClassName('post-agenda')[i];
    var buttomPlus = document.getElementsByClassName('fa-plus')[i];

    (function(agenda, detalhesDaAgenda){
        agenda.onclick = function() {
            alert(detalhesDaAgenda);  
            return false;
        };
    }(abrirAgenda[i], detalhesAgenda.textContent));

}

Esta IIFE irá criar um escopo léxico e quando o evento do click for disparado ele irá utilizar o valor esperado no alert.

por Petrus Henrique Soares de Melo
| 77.3k xp | 10 posts

Fala Felipe, tudo bem? Obrigado pela ajuda.

Eu entendi oq vc fez, só não entendi ainda por que tem que ser feito dessa forma. Acho que não compreendi muito bem o escopo do javascript de funções. Vou da uma pesquisada.

Comecei a estudar js a pouco tempo, e foi minha primeira linguagem estudada após terminar lógica de programação. Por isso to empacando com essas coisinhas.

Obrigado!