Atenção JavaScript Gurus: Precisa de uma mão com setInterval ()

Question

Estou tentando fazer uma tela não interativa para uma janela da loja imobiliária.

Já faz um tempo desde que brinquei setInterval().

A primeira vez que meu script passa, está tudo bem. Mas quando tenta obter a próxima propriedade via getNextProperty(), começa a ficar maldito. Se você tem Firebug, ou uma saída equivalente de console.log(), você verá que está chamando as coisas que não deveria!

Agora, há um pouco de JavaScript, então me sentirei melhor ligando -me do que postar tudo.

Exibição da loja

JavaScript ofensivo

Vale ressaltar que todo o meu DOM/Ajax é feito com o JQuery.

Eu tentei o melhor para ter certeza clearInterval() está funcionando e parece não executar nenhum código abaixo dele.

o setInterval() é usado para pré -carregar a próxima imagem e exibi -la na galeria. Quando o intervalo detecta, estamos na última imagem ((nextListItem.length === 0)), destina -se a esclarecer esse intervalo e começar de novo com uma nova propriedade.

Está me deixando maluco há um tempo, então alguém capaz de me ajudar?

Provavelmente é algo realmente óbvio!

Muito Obrigado!

Atualizar

Bem, agora me sinto melhor em saber que o problema era minha ingestão de assumir que os plugins funcionariam fora da caixa.

Eu recebi este plugin de uma resposta no transbordamento da pilha. Eu altinei o autor desta pergunta.

Obrigado por todas as suas respostas!

Answer 1

Aqui está a sua área problemática:

jQuery.extend(jQuery, {
  imagesToLoad: 0,

O problema é que essa variável é global/compartilhada (jQuery.imagesToLoad), então esta verificação mais tarde:

if(jQuery.loadedImages.length >= jQuery.imagesToLoad){

Depende deste plugin não ser chamado duas vezes ao mesmo tempo, caso contrário, se a verificação ficar maluca, já que você está chamando isso mais tarde no seu código:

$.preloadImages({
  urls: [nextImage],

Essa contagem cai para 1, fazendo o if avaliar true Não apenas na última imagem, mas todas as imagens após as primeiras em conjuntos após o primeiro (devido a quando o retorno de chamada é executado, ela se sobrepõe ao tempo), o que causa o complete retorno de chamada para disparar muitos vezes, não apenas uma vez, então este código:

$.preloadImages({
 urls: preloadImages,
 complete: function() { showProperty(property); }
});

... vê isso complete função em execução muitos vezes, então você está começando muitos intervalos ao mesmo tempo (é por isso que você vê console.log('show property called' + property.slug) execute tantas vezes no log).

Correção curta: substitua o preloadImages código com uma versão que não usa uma variável global :)