4

Estou recebendo dentro de uma div novos elementos via PHP usando XMLHttpRequest.
Até ai tudo bem, obtenho os elementos e exibe tudo certinho, porém estou não estou conseguindo obter o ID desses novos elementos utilizando o evento de Click.

Ex:

<div id="res"> 
    <li class="new" id="50">Novo Elemento</li> 
    <!-- aqui é inserido o novo elemento via XMLHttpRequest (do PHP). -->
</div>

no meu JS faço (mas não funciona):

var el = document.getElementsByClassName('new');
for(var i = 0; i < el.length; i++){
    el[i].addEventListener('click', function(){
       alert( this.getAttribute('id') ); //aqui seria o ID que to precisando. :(
    }, false);
}

Preciso de algo semelhante ao code abaixo, só que em JavaScript(Puro) sem usar JQuery:

$('#res').on('click', 'li.new', function(){
    alert( $(this).attr('id') ); //aqui retorna certo...
});

Pesquisei pelo Google mas não encontrei nada.

Como poderia fazer isso?

0

1 Resposta 1

2

Pode fazer um delegador próprio.

Se só houver li dentro da div então o e.target.id deve dar o que precisa, senão tem de verificar e.target.tagName.toLowerCase() == 'li' primeiro. Pode juntar ainda uma condição para verificar a classe. Usando classList.contains ou className.indexOf('new') != -1

Por exemplo:

var res = document.getElementById('res');
res.addEventListener('click', function(e){
       var elemento = e.target;
       if (elemento.tagName.toLowerCase() == 'li' && elemento.classList.contains('new')) alert(elemento.id);
       else return false;
}, false);

Exemplo: http://jsfiddle.net/fz6368a9/

3
  • 1
    Se entendi bem, o próprio #res é insirido dinamicamente
    – bfavaretto
    Commented 21/10/2014 às 18:09
  • 1
    @bfavaretto se o #res também fôr dinamico então o event handler pode ser adicionado à window: jsfiddle.net/9374tgbf
    – Sergio
    Commented 21/10/2014 às 18:16
  • 2
    @Sergio deu certo era isso mesmo que eu precisava. Obrigado
    – Roma
    Commented 21/10/2014 às 18:20

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .