Die Methode toggle() wird verwendet, um die Sichtbarkeit ausgewählter Elemente zu prüfen, um für die ausgewählten Elemente zwischen hide() und show() umzuschalten.

  • show() wird ausgeführt, wenn das Element ausgeblendet ist.
  • hide() wird ausgeführt, wenn das Element sichtbar ist.

Syntax:

$(selector).toggle(speed, easing, callback)

Parameter: Es hat drei optionale Parameter:

  • Geschwindigkeit: Wird verwendet, um die Geschwindigkeit des Toggle-Effekts festzulegen. Dies kann in Millisekunden, langsam oder schnell erfolgen.
  • Easing: Es wird verwendet, um die Geschwindigkeit des Elements an den verschiedenen Animationspunkten anzugeben.
  • Callback: Die Funktion, die unmittelbar nach dem Toggle-Effekt aufgerufen werden soll.

Unten ist das Beispiel, um die Methode toggle() zu zeigen:

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $("#gfg").toggle();
            });
        });
    </script>
    <style>
        #gfg {
            color: green;
            border: 5px solid black;
            width: 200px;
            text-align: center;
        }
    </style>
    </style>
</head>
  
<body>
  
    <div id="gfg">GeeksforGeeks</div>
  
    <button>Click to hide() and show() the above div</button>
  
</body>
  
</html>

Ausgabe:
Vor Klick auf die Schaltfläche:

Nach Klick auf den Button:

Nach erneutem Klick auf den Button: