jQuery evenement - toggle() methode

Voorbeeld

Wissel verschillende achtergrondkleuren:

($("p").toggle(),
  function(){
  ($("body").css("background-color","green");},
  function(){
  $("body").css("background-color","red");}
  function(){
  $("body").css("background-color","yellow");}
);

Probeer het zelf

Definitie en gebruik

De toggle() methode wordt gebruikt om twee of meer event handler functies te binden om te reageren op de klik gebeurtenissen van de geselecteerde elementen.

Deze methode kan ook worden gebruikt om de hide() en show() Methode.

Bind twee of meer functies aan Toggle Event

Schakel tussen twee of meer functies wanneer het gespecificeerde element wordt geklikt.

Als er twee of meer functies zijn opgegeven, zal de toggle() methode alle functies switchen. Bijvoorbeeld, als er drie functies zijn, wordt de eerste functie aangeroepen bij het eerste klikken, de tweede functie bij het tweede klikken, de derde functie bij het derde klikken. De vierde klik roept opnieuw de eerste functie aan, enzovoort.

Syntaxis

$(selector).toggle(function1(),function2(),functionN(),...)

Probeer het zelf

Parameters Beschrijving
function1() Verplicht. Functie die wordt uitgevoerd wanneer het element voor de tweede keer wordt geklikt.
function2() Verplicht. Functie die wordt uitgevoerd wanneer het element voor de eerste keer wordt geklikt.
functionN(),... Optioneel. Stelt andere functies in die moeten worden geswitched.

Schakel Hide() en Show()

Controleer of elk element zichtbaar is.

Als het element verborgen is, wordt show() uitgevoerd. Als het element zichtbaar is, wordt hide() uitgevoerd. Op deze manier kan een schakelingseffect worden gecreëerd.

Syntaxis

$(selector).toggle(speed,callback)

Probeer het zelf

Parameters Beschrijving
speed

Optioneel. Stelt de snelheid van het hide/show effect in. Standaard is "0".

Mogelijke waarden:

  • miliseconden (bijv. 1500)
  • "slow"
  • "normal"
  • "fast"
callback

Optioneel. Functie die wordt uitgevoerd wanneer de toggle() methode is voltooid.

Voor meer informatie over callbacks, bezoek onze Callback Functie Handleiding.

Weergeven of verbergen van elementen

Stelt vast of alleen de geselecteerde elementen moeten worden weergegeven of verborgen.

Syntaxis

$(selector).toggle(switch)

Probeer het zelf

Parameters Beschrijving
switch

Verplicht. Booleaanse waarde, bepaalt of toggle() alleen alle geselecteerde elementen moet weergeven of verbergen.

  • true - Elementen weergeven
  • false - Elementen verbergen