arre estou trabalhando numa atividade que a cada 10 segundos atualiza partes de uma tela usando jquery, buscando dados no formato json vindo do servidor, o pequeno elemento de tela eh cheio de regras, tem partes que aparecem e são ocultas num clique … coisas assim tipo árvore que faz collapse e expand… mas misteriosamente quando a janela era atualizada, acontecia uma mágica da telinha ficar abrindo e fechando várias vezes ,,,  tipo poltergeist mesmo !! assombracação total … mas como não tenho a menor afeição por assombrações, investiguei.

Na primeira investida, fiz uma mudança que foi a geração da tabela em si que mostra os dados, separei em duas fases :

  • fase 1 monta o html da tabela onde os dados vao ficar
  • fase 2 atualiza soh a parte interna da tabela onde vai ocorrer a atualização

isto ficou legal, porque o erro mudou, ao invés de piscar abria e fechava várias vezes tão rapido, que nem se mexia, consegui constatar isto usando o mecanismo de debug que tinha falado anteriormente, e vi várias chamadas uma atrás da outra.

Bem refletindo sobre isto identifique finalmente o problema ! ufa ! ao atualizar a tabela estava chamando o trecho de código que fazia bind do clickpara mostrar/esconder, ou seja para cada atualização adicionava um novo tratador de eventos para o click, ou seja cada vez que clicava fazia um monte de vezes o clique eheehehe.

anexo um exemplo do uso do clique para alternar a exibição de um trecho.

expand.html

Note que o trecho que faz a “magica” esta totalmente desconectado do html em si …

$(document).ready( function(){

$(‘#change’).click( function(){

if( $(this).html() == ‘[+]‘ ){
$(‘#data’).show();
$(this).html(‘[-]‘);
}else {
$(‘#data’).hide();
$(this).html(‘[+]‘);
}
});
$(‘#change’).css(‘cursor’, ‘pointer’ );

});

Ou seja este trecho insere o comportamento de clique no elemento com id=change, e somente insere este comportamento do clique quando o documento esta carregado. e ao clicar verifica o conteudo do html se for [+] mostra a área ocula, e troca o texto senão oculta novamente e torna a trocar o texto para [+].

Lição aprendida ! cuidado ao atribuir event handlers, porque se adicionar dentro de um loop vai arrumar váaaarias execuções hehehe :D