Wie führe ich $(window).resize() nur einmal aus, nachdem die Größenänderung des Fensters abgeschlossen ist?

Targeting-Ereignisabschluss: $(window).resize() nach der Ausführung

Bei Verwendung von $(window).resize(function() { ... }) Um die Größenänderung des Browserfensters zu überwachen, kann es bei der manuellen Fensteranpassung zu mehreren Ereignisauslösungen kommen. Dieses Problem tritt auf, da das Ereignis jedes Mal ausgelöst wird, wenn der Fensterrand gezogen wird, was zu unerwünschtem Verhalten führt. Um dieses Problem zu beheben, untersuchen wir eine Lösung, die sicherstellt, dass die Ausführung erst nach Abschluss des Größenänderungsprozesses erfolgt.

Der folgende Codeausschnitt bietet eine praktische Lösung, die in verschiedenen Teilen Ihres Codes verwendet werden kann:

<code class="javascript">var waitForFinalEvent = (function () {
  var timers = {};
  return function (callback, ms, uniqueId) {
    if (!uniqueId) {
      uniqueId = "Don't call this twice without a uniqueId";
    }
    if (timers[uniqueId]) {
      clearTimeout (timers[uniqueId]);
    }
    timers[uniqueId] = setTimeout(callback, ms);
  };
})();</code>

Um diese Lösung zu nutzen, führen Sie die folgenden Schritte aus:

1. Implementieren Sie einen benutzerdefinierten Ereignis-Listener für die Fenstergrößenänderung.

<code class="javascript">$(window).resize(function () {</code>

2. Im Ereignis-Listener , rufen Sie waitForFinalEvent auf, um eine Zeitüberschreitung für den Rückruf festzulegen.

<code class="javascript">    waitForFinalEvent(function(){
      alert('Resize...');
      //...
    }, 500, "some unique string");</code>

Der Parameter 500 stellt eine Verzögerung von 500 Millisekunden dar, sodass ausreichend Zeit für den Abschluss des Größenänderungsprozesses bleibt. Der Parameter „uniqueId“ stellt sicher, dass mehrere Rückrufe ohne Interferenzen denselben Timeout-Mechanismus nutzen können.

Mit dieser modifizierten Lösung können Sie mehrere Rückrufe definieren, die ausgeführt werden, nachdem die Fenstergrößenänderung abgeschlossen ist, und so verschiedene Abschnitte Ihres Codes effektiv bedienen.

Das obige ist der detaillierte Inhalt vonWie führe ich $(window).resize() nur einmal aus, nachdem die Größenänderung des Fensters abgeschlossen ist?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!