Wie erkennt man genaue Ereignisse zur Fenstergrößenänderung in JavaScript/jQuery?

Erkennen genauer Ereignisse zur Fenstergrößenänderung in JavaScript/jQuery

Bei der Verwendung von $(window).resize zur Überwachung von Fenstergrößenänderungen kommt es häufig dazu Bei der manuellen Größenänderung treten mehrere Ereignisauslösungen auf. Dies kann problematisch sein, wenn Sie Code erst ausführen müssen, nachdem die Größenänderung abgeschlossen ist.

Lösung:

Um dieses Problem zu beheben, können wir die Funktion „waitForFinalEvent“ verwenden:

<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>

Diese Funktion stellt sicher, dass der Rückruf erst nach einer angegebenen Verzögerung (standardmäßig 500 ms) nach dem letzten Größenänderungsereignis ausgeführt wird. Der uniqueId-Parameter ermöglicht die konfliktfreie Verwendung mehrerer Rückrufe.

Verwendung:

Um diese Funktion zu nutzen, können Sie Ihren Code wie folgt ändern:

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

Durch die Implementierung dieser Lösung können Sie sicherstellen, dass Ihr Code genau auf Fenstergrößenänderungsereignisse reagiert und erst ausgeführt wird, nachdem die Größenänderung abgeschlossen wurde.

Das obige ist der detaillierte Inhalt vonWie erkennt man genaue Ereignisse zur Fenstergrößenänderung in JavaScript/jQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!