6

Tenho uma função em que toda vez que eu der scroll ele chama uma certa função, só que quero chamar ele apenas uma vez

    $(window).on('scroll', function(e){
        //aparece segundo menu
        if($(this).scrollTop() >= navHeight + section01Height){
            navSecundariaShow();
        }
        else if($(this).scrollTop() < navHeight + section01Height){
            navSecundariaHide();
        }

    });

Ou seja, assim que alcançar determinada altura do scroll, ele chama essa função.

Mas não pode chamar toda vez a partir dai, como faço?

0

2 Respostas 2

9

A forma mais simples de resolver isso (se você quer que o evento seja ativado apenas uma vez cada vez que o usuário visitar a página.) seria usar uma variável pra checar se o comportamento já ocorreu (ou não).

var hasBeenTriggered = false;

$(window).on('scroll', function(e){
    //aparece segundo menu
    if($(this).scrollTop() >= navHeight + section01Height && !hasBeenTriggered){
        navSecundariaShow();
        hasBeenTriggered = true;
    }
    else if($(this).scrollTop() < navHeight + section01Height && hasBeenTriggered){
        navSecundariaHide();
    }

});  

Você também pode trocar o && do else if por um condicional OR ||, conforme a sua necessidade. Dessa forma a princípio ele verifica se o seu painel já foi exibido, se não foi, exibe e muda o estado para true. Assim, esse código não se executa mais, a não ser que você mude isso no código mais tarde.

Adicionalmente, você pode deixar o && hasBeenTriggered do bloco else if que retornará sempre truese o painel já tiver sido aberto, para se certificar que o método navSecundariaHide()não seja chamado desnecessáriamente no futuro.

Não sei se era exatamente esse seu objetivo. Essa é a forma mais simples que consigo pensar no momento.


EDIT: Aplicando o exemplo do @Renato Tavares ao exemplo do OP, ficaria algo assim:

$(window).one('scroll', function(e){ ... }

Ao invés de chamar o método .on(event,handler), trocá-lo por .one(event,handler) como sugerido faria com que o evento fosse ativado apenas a primeira vez que é chamado. Para outros usos pode-se ver o link que nosso colega colocou dos docs de jQuery. Embora não tenha tido tempo de testá-lo, parece que o uso seria até mais simples do que o uso da variável hasBeenTriggered conforme sugeri.

O upside de usar a variável seria o caso de você desejar verificar se o painel ainda está aberto ou fechado, dependendo de como é o fluxo do seu código e seu objetivo.

1
  • sensacional, não tenho nem como agradecer cara. Commented 2/01/2015 às 20:02
2

Já tentou usar o .one() de acordo com a documentação ele só é executado uma única vez. O exemplo é o seguinte:

$( "#foo" ).one( "click", function() {
  alert( "This will be displayed only once." );
});

No seu caso um .off(event) já deveria resolver:

$( "#foo" ).on( "click", function( event ) {
  alert( "This will be displayed only once." );
  $( this ).off( event );
});
2
  • obrigado, funcionou também Commented 2/01/2015 às 20:04
  • 2
    A vantagem aqui é que você reduz o uso de variáveis globais. Commented 2/01/2015 às 20:05

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 .