2013-08-09 12 views
5

Quando si esegue la funzione di associazione per scorrere e far scorrere la rotellina del mouse una volta, la funzione viene eseguita sette o otto volte. Voglio che venga eseguito una sola volta quando faccio scorrere una volta la rotellina del mouse, è possibile? Io uso questo codice:jQuery - come trattare lo scroll come singolo evento?

$(document).ready(function() { 
    $(window).bind('scroll', function() { 
     alert("Scroll.");   
    } 
    }); 
}); 
+0

quanto scolling è " una volta"? Ogni browser ha la sua risoluzione di scorrimento. Lo scorrimento breve può chiamare molti eventi di scorrimento. È naturale. – picios

+0

Con una sola volta intendo una pergamena ininterrotta, non importa per quanto tempo – maciejjo

risposta

0

Se per "una volta" vuoi dire, una volta-per-page-load, si potrebbe separare l'evento nel ascoltatore con il metodo off(). http://api.jquery.com/off/

C'è anche la possibilità di namespacing eventi come:

scroll.namespace è ancora lo stesso evento, ma è possibile separare in modo specifico.

$(document).ready(function() { 
    $(window).on('scroll.myEvent', function() { 
     $(window).off('scroll.myEvent'); 
     alert("Scroll.");   
    } 
    }); 
}); 
6

Prova

$(document).ready(function() { 
    var timerId; 
    $(window).bind('scroll', function() { 
     clearTimeout(timerId) 
     timerId = setTimeout(function(){ 
      alert("Scroll.");   
     }, 200) 
    }); 
}); 

Demo: Fiddle

+0

@downvoter mi sono perso qualcosa qui –

+0

Non ero io, ho fatto +1 tu. Per velocità se non altro;) –

+0

@RoryMcCrossan è un problema noto e soluzione –

4

È possibile utilizzare la funzione della valvola a farfalla da jQuery throttle debounce plugin.

$(function() { 
    $(window).bind('scroll', $.throttle(100, function() { 
     console.log('scroll'); 
    })); 
}); 
4

solo una variante di Aruns risposta:

approccio simile, solo che l'evento ottiene licenziato immediatamente e viene quindi impedito da trattare ancora per un intervallo di tempo. In modo da non dover aspettare prima di gestire l'evento.

$(document).ready(function() { 
    var locked = false 
     , timeout; 

    $(window).bind('scroll', function() { 
     //do nothing if still locked 
     if(true === locked){ 
      return false; 
     } 
     //lock 
     locked = true; 

     //do something if not locked 
     alert('scroll!') 

     clearTimeout(timeout) 
     timeout = setTimeout(function(){ 
      //unlock 
      locked = false;   
     }, 1000) 
    }); 
}); 
+1

Questa soluzione sta funzionando. Non riesco a vedere come non è valutato più alto. – CyberHawk

+1

Questa dovrebbe essere la risposta accettata e sicuramente la più votata. – SISYN

0

Se si desidera rilevare lo scorrimento solo una volta, usare questo:

$(function() { 
    var done = false; 
    $(window).bind('scroll', function() { 
     if (!done){ 
      alert("Scroll."); 
      done = true; 
     } 
    }); 
}); 

, ma se si vuole rilevare ogni evento di scorrimento, provare qualcosa di simile la risposta 4