Wie wechsle ich mit jQuery zwischen Funktionen beim Klicken?

Wechseln zwischen Funktionen beim Klicken mit jQuery

In jQuery kann die Aufgabe des Wechselns zwischen Funktionen beim Klicken auf ein Element mit verschiedenen erreicht werden Ansätze.

Integrierte jQuery .toggle()

jQuery bietet zwei Versionen der .toggle()-Methode. Die in der Frage erwähnte Funktion, die zum Umschalten der Sichtbarkeit verwendet wird, ist jetzt veraltet. Es gibt jedoch eine alternative Version, die speziell für den Wechsel zwischen Funktionen per Klick entwickelt wurde.

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

Diese Methode akzeptiert zwei Funktionen als Argumente und wechselt bei jedem Klick zwischen ihnen.

Benutzerdefiniertes Plugin

Alternativ ist es möglich, ein benutzerdefiniertes Plugin zu erstellen, das eine vielseitigere Implementierung bietet. Dieses Plugin namens „clickToggle“ ermöglicht die Zuweisung mehrerer Funktionen und kann für jedes beliebige Ereignis verwendet werden.

$.fn.clickToggle = function(func1, func2, ...) {
    var funcs = [func1, func2, ...];
    this.data('toggleclicked', 0);
    this.click(function() {
        var data = $(this).data();
        var tc = data.toggleclicked;
        $.proxy(funcs[tc], this)();
        data.toggleclicked = (tc + 1) % funcs.length;
    });
    return this;
};

Um dieses Plugin zu verwenden, geben Sie die Funktionen als Argumente an:

$('#element').clickToggle(function1, function2);

Verbesserte Implementierung

Der bereitgestellte Code kann für eine bessere Leistung weiter optimiert werden:

$(function() {
    var clickCallbacks = [function1, function2];
    $('#element').click(function() {
        clickCallbacks[$(this).data('toggleclicked')++]();
    });
});

Dieser Ansatz reduziert die Anzahl der Funktionsaufrufe erheblich, indem nur der Click-Handler zugewiesen wird einmal, was zu schnelleren Ausführungszeiten führt.

Das obige ist der detaillierte Inhalt vonWie wechsle ich mit jQuery zwischen Funktionen beim Klicken?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!