스로틀 이벤트
1646 단어 자바 script
function handler() {
//
// ajax
console.log('2333');
}
$(window).scroll(handler); // handler，
방법 1 setTimeout
var timer = 0;
$(window).scroll(function() {
if (!timer) {
timer = setTimeout(function() {
handler();
timer = 0;
}, 1000);
}
});
방법 2 setInterval
// scroll ， scrolled ，
var scrolled = false;
$(window).on('scroll', function() {
scrolled = true;
});
setInterval(function() {
if (scrolled) {
handler();
scrolled = false;
}
}, 1000);한 장면 상상: 실시 간 검색
입력 상자 에 키 워드 를 입력 하면 바로 결 과 를 표시 합 니 다. 보통 keyup 에 handler 처리 함 수 를 연결 하여 ajax 요청 을 보 냅 니 다.그러나 사용자 의 입력 속도 가 빠 르 면 keyup 은 여러 번 촉발 되 고 여러 개의 ajax 요청 을 보 냅 니 다. 저 희 는 사용자 가 입력 을 중단 하 는 시간 이 1s 를 초과 한 후에 야 ajax 를 보 내 려 고 합 니 다.
이것 은 앞의 scroll 이벤트 와 조금 다 릅 니 다. 여기 서 handler 함수 가 keyup 에서 트리거 한 후에 앞의 두 가지 방법 을 실행 하고 싶 습 니 다. handler () 가 트리거 하 는 빈 도 를 줄 였 을 뿐 입 니 다. 그러나 여러 번 트리거 할 수 있 습 니 다.
방법 3 clearTimeout
var searchTimeout = null;
$('#input').on('keyup', function(event) {
// keyup ， keyup 1s handler
clearTimeout(searchTimeout);
searchTimeout = setTimeout(function() {
handler();
}, 1000);
});참고: < jQuery 기초 강좌 >
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Thymeleaf 의 일반 양식 제출 과 AJAX 제출텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
