JavaScript/jQuery에서 창 크기 조정 후 한 번만 함수를 실행하는 방법은 무엇입니까?-JS 튜토리얼-php.cn

JavaScript/jQuery에서 창 크기 조정 후 한 번만 함수를 실행하는 방법은 무엇입니까?

Mary-Kate Olsen

풀어 주다： 2024-11-04 15:58:01

원래의

652명이 탐색했습니다.

How to Execute a Function Only Once After Window Resizing in JavaScript/jQuery?

JavaScript/jQuery에서 창 크기 조정 후 실행 지연

브라우저가 실행될 때 JavaScript 및 jQuery의 $(window).resize 이벤트가 트리거됩니다. 창 크기가 조정됩니다. 그러나 창 가장자리를 드래그하여 수동으로 크기를 조정하는 동안 여러 번 실행되는 경우가 많습니다.

단일 호출 달성:

크기 조정 후 한 번만 함수를 호출하려면 완료되면 타이머를 사용하여 크기 조정 프로세스가 완료될 때까지 실행을 지연할 수 있습니다. 해결책은 다음과 같습니다.

해결책:

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

로그인 후 복사

사용법:

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

로그인 후 복사

이 솔루션에서는 고유한 식별자는 여러 이벤트 등록을 처리하기 위해 각 콜백에 사용됩니다.

이 접근 방식을 사용하면 지정된 지연 후에 콜백 함수가 한 번만 호출되어 크기 조정이 완료되는 데 충분한 시간을 제공하고 중복 이벤트 발생을 방지할 수 있습니다.

위 내용은 JavaScript/jQuery에서 창 크기 조정 후 한 번만 함수를 실행하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!