여러 $(window).resize 이벤트 발생을 방지하는 방법은 무엇입니까?

$(window).resize를 사용하여 여러 크기 조정 이벤트 발생 해결

웹 개발에서 $(window).resize 이벤트를 사용하여 브라우저 창 크기를 조작하면 트리거될 수 있습니다. 여러 번의 발사. 이 문제를 해결하기 위해 우리는 크기 조정 작업이 완료된 후에만 함수를 실행하는 솔루션을 탐색합니다.

해결책:

브라우저 창 크기 조정 후 함수를 호출하는 방법은 다음과 같습니다. 완료되면 waitForFinalEvent 함수를 활용할 수 있습니다. 이 함수는 콜백 함수, 밀리초 지연 및 고유 식별자를 인수로 사용합니다. 이 함수는 지연을 기반으로 콜백에 대한 시간 제한을 설정하지만 동일한 고유 ID를 가진 이전 시간 제한이 존재하는지 확인합니다. 그렇다면 이전 제한 시간을 취소하고 새 제한 시간을 설정합니다.

구현:

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

사용:

다음과 같이 코드에 waitForFinalEvent 함수를 구현합니다.

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

각 콜백에 고유한 ID를 제공함으로써 이 구현은 별도의 콜백이 서로의 시간 초과 이벤트를 방해하지 않도록 보장합니다. 따라서 이 기능은 크기 조정 작업이 완료된 후에만 실행되므로 여러 번 실행되는 것을 방지할 수 있습니다.

위 내용은 여러 $(window).resize 이벤트 발생을 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!