JavaScript에서 다중 '크기 조정' 이벤트 트리거를 방지하는 방법은 무엇입니까?

여러 '크기 조정' 이벤트 트리거 관리

개발자는 크기 조정 프로세스 중에 '크기 조정' 이벤트의 여러 트리거를 처리하는 문제에 자주 직면합니다. 이로 인해 원치 않는 동작이나 비효율성이 발생할 수 있습니다. 원하는 작업만 한 번 실행되도록 하려면 'resize' 이벤트의 '끝'을 기다리는 방법을 이해하는 것이 중요합니다.

주어진 코드 샘플에서 볼 수 있듯이 일반적인 접근 방식 중 하나는 $ (창).resize(function(){resizew();}) 메서드. 그러나 이 메소드는 진행 중인 크기 조정 프로세스 중에 resizew() 함수를 여러 번 트리거합니다.

이를 극복하기 위해 setTimeout() 및clearTimeout() 메소드를 활용할 수 있습니다. 이 전략을 사용하면 resizew() 함수를 트리거하기 전에 지연을 설정할 수 있습니다. 예를 들어 시간 초과를 100ms로 설정하면 크기 조정이 완료될 때까지 특정 시간 동안 기다릴 수 있습니다. 이 지연 동안 새로운 크기 조정 이벤트는 타이머를 '재설정'하여 크기 조정 프로세스가 실제로 완료된 후에만 실행되도록 보장합니다.

다음은 이 접근 방식을 설명하는 코드 예제입니다.

function resizedw(){
    // Haven't resized in 100ms!
}

var doit;
window.onresize = function(){
  clearTimeout(doit);
  doit = setTimeout(resizedw, 100);
};

이 코드 샘플은 편의를 위해 jsfiddle에서 찾을 수 있습니다.

위 내용은 JavaScript에서 다중 '크기 조정' 이벤트 트리거를 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!