실행 jQuery 함수 만 ONCE (이벤트 발생시 무한 루프 대신)

사용자가 광고 클래스 높이 (및 이후)까지 스크롤 할 때 발생하는 jQuery 코드가 있습니다. 문제는 내가 한 번만 실행하고 경고를 중지하기 위해서입니다. 아주 간단한 팅겨 (와의 setTimeout이나 변수를 설정하지 않고)실행 jQuery 함수 만 ONCE (이벤트 발생시 무한 루프 대신)

CSS :

header{width:100%;height:200px;background:teal;} 
.ad{width:500px;height:120px;margin:0 auto;background:red;} 
article{width:100%;height:1500px;background:yellow;}

HTML :

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
</head> 
<body> 
    <header> 
    <div class='ad'></div> 
    </header> 
    <article></article> 
</body> 
</html>

JQuery와 :

$(function(){ 
    $(window).scroll(function(){ 
    var aTop = $('.ad').height(); 
    if($(this).scrollTop()>=aTop){ 
     alert('header just passed.'); 
    } 
    }); 
});

감사합니다! 여기

출처

2014-02-26 Anonymous

가능한 복제본 : http://stackoverflow.com/questions/8429020/call-a-function-only-once – ltalhouarne

중복 없음 ... 다른 의미 –

당신은 이동 :

http://jsfiddle.net/hamoom/qX6bn/

$(function(){ 

var alerted = false; 

$(window).scroll(function(){ 
var aTop = $('.ad').height(); 

if($(this).scrollTop()>=aTop && !alerted){ 
    alerted = true; 
    alert('header just passed.'); 
} 
else if($(this).scrollTop()<=aTop && alerted){ 
    alerted = false; 
} 
}); 
});

난 그냥 반복이 경고를 발사 방지하기 위해 플래그를 사용합니다. 같이

$(window).on('scroll.foo', function(){ 
    // stop this once and for all! 
    if(something == true) 
     $(window).off('scroll.foo'); 
});

: 다시 스크롤 할 때까지 같은 경고를 얻을 수 있도록 내가 다시

출처

2014-02-26 01:35:58 hamobi

위아래로 스크롤하면 추가 경고가 발생합니다 (S) ... http://jsfiddle.net/qX6bn/1/ –

그리고 외부 변수를 사용하지 않고 더 깨끗한 방법이 있다고 생각했습니다. D –

추가 경고가 필요하지 않으면 그냥 다른 블록을 제거하십시오. 몇 가지 추가 변수를 사용하십시오. 그 기능은 당신이 첫 번째 경고를 받으면 스크롤을 계속한다 .. 어떻게 든 그것을 멈춰야한다. – hamobi

$(function(){ 
    var alerted = false; 

    $(window).scroll(function(){ 
    var aTop = $('.ad').height(); 

    if($(this).scrollTop()>=aTop && !alerted){ 
     alerted = true; 
     alert('header just passed.'); 
    } 
    }); 
});

출처

2014-02-26 01:44:33

당신이 on 및 off과 같이 사용해야 "다른"블록에 재설정 위의 경우 이벤트를 바인딩 할 때 범위를 사용해야하므로 동일한 객체에 바인딩 될 수있는 정확한 이벤트에 아무런 영향을주지 않고 나중에 바인딩을 해제 할 수 있습니다 (이 경우 , 창 객체).

특정 조건이 충족되면 청취자가 존재하지 않으므로 콜백이 실행되지 않습니다.

출처

2014-07-02 14:27:11 vsync

실행 jQuery 함수 만 ONCE (이벤트 발생시 무한 루프 대신)

답변

관련 문제