1

Então moçada, tenho um esquema aqui tipo FAQ que o administrador do site que cadastra as Faqs. Cada nova pergunta cadastrada gera duas novas divs:

<div>Pergunta1</div>
<div>Resposta1</div>

Ai eu uso um Jquery pra fazer o efeito de toggle. Quando a pessoa clica na pergunta exibe a resposta:

$(function(){ 
    $('#pergunta1').click(function(){
    $('#respota1').toggle(700);         
});

Só que na media que as divs de pergunta e resposta são adicionadas eu tenho que adicionar o jQuery manualmente.

Se cadastrar outra:

<div>Pergunta2</div>
<div>Resposta2</div>

Ai eu teria que fazer outro Jquery mostrado lá em cima alterando...

 $(function(){ 
        $('#pergunta2').click(function(){
        $('#respota2').toggle(700);         
 });

Teria como o jQuery automatizar isso? Tipo um while ou algo assim?

9
  • Podes explicar o código que "gera duas novas divs"? Ele cria IDs nos elementos?
    – Sergio
    8/01/2017 às 15:51
  • Qual é o elemento onde essas divs são inseridas? é um mesmo elemento para todas?
    – Sergio
    8/01/2017 às 15:59
  • É um while no php que puxa do banco... e um contador que fica no id.. tipo: <?php $a = 1; while(...){ ?> <div id="pergunta<?php echo $a?>"></div>"; <?php $a++; } ?> 8/01/2017 às 15:59
  • Qual é o elemento onde essas divs são inseridas? é um mesmo elemento para todas?
    – Sergio
    8/01/2017 às 16:03
  • Elas ficam dentro de um box com outra div 8/01/2017 às 16:05

1 Resposta 1

0

Tens de delegar esse evento e dizer ao jQuery o que procurar.

Para delegar o evento tens de usar um elemento que já exista, pai dessas divs que vão sendo inseridas.

Para o jQuery saber o que procurar podes usar um pseudo seletor ^=.

Assim o código pode ser:

$('#elementoPai').on('click', '[id^="pergunta"]', function(){
    var pergunta = this;
    var idResposta = pergunta.id.match(/\d+/)[0];
    var resposta = document.getElementById('resposta_' + idResposta);
    // etc...
});

Podes ler mais sobre delegação aqui: https://pt.stackoverflow.com/a/5199/129

2
  • Top irmão vou testar aqui e trago o retorno! Valeu a força! 8/01/2017 às 16:25
  • @JaiderMasterInfo diz se houver algo que não compreendas. A ideia de delegar é porque não dá para adicionar auscultadores de eventos a elementos que ainda não existem na página quando o JavaScript é lido.
    – Sergio
    8/01/2017 às 16:27

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 .