jquery 콜백 함수를 중지하는 방법?

Question

내가이 개 HTML 요소가 : 나는를 클릭 한 다음 B를 클릭하면, 그것은 괜찮습니다 "안녕하세요", 어느 날 표시됩니다

$('A').click(function(){ 
    $('B').click(function(){ 
     console.log("hello"); 
    }) 
}) 

: A와 B를, 여기에 jQuery 코드입니다. 그러나 A를 다시 클릭 한 다음 B를 클릭하면 이번에는 나에게 "안녕하세요"라는 메시지가 표시되어 바람직하지 않습니다. 나는 오직 하나만 인사하고 싶다.

나는 그 원인을 다소 알기 때문에 콜백 함수의 결과 일 수 있습니다. B는 사용자가 첫 번째 클릭 이후에도 계속 클릭하기를 기다리고 있습니다.

지금 내 질문은 : "A"("클릭 B"는 "A를 클릭"의 콜백 기능 임) 내부에서 "B 클릭"을 원한다면 어떻게하면 이중 결과 문제를 해결할 수 있습니까?

콜백 함수를 처음 사용했습니다. 제발 도와주세요!

Answer 1

문제는 A 각 연속 클릭하여 B 또 다른 클릭 핸들러를 추가하는 것이다. 각 핸들러는 B을 클릭하면 실행됩니다. 따라서 A을 10 번 클릭하면 열 개의 클릭 핸들러가 B으로 바운드되었습니다 .-D

다른 솔루션, 일정하지 않은 리 바인딩 및 전역 변수가 모두 문제가되지 않도록하려면이 깨끗한 해결책을 대신 사용하십시오. 대신 클릭의 .one()를 사용하여

$('A').one("click", function(){ 
    $('B').click(function(){ 
     console.log("hello"); 
    }) 
}) 

는 A에 클릭 이벤트는 요소 B에 정확히 하나의 클릭 이벤트 핸들러를 바인딩 한 번만 실행됩니다.

Example Fiddle

Answer 2

현재 코드가 생각하는 바대로 작동하지 않습니다. A을 클릭 할 때마다 B에 새 클릭 핸들러가 추가됩니다. 따라서 A을 세 번 클릭하면 B에 3 개의 클릭 핸들러가 있으며 B는 클릭 할 때마다 실행됩니다.

한 수정, 조식 등록을 취소 클릭 핸들러로 내부 핸들러를 클릭하는 것입니다 예 :

$('A').click(function(){ 
    // Ensure we only ever have one click-handler on B 
    // by clearing existing handlers before adding our 
    // new one. 
    $('B').unbind('click').click(function(){ 
     console.log("hello"); 
    }) 
}) 

그러나,이 코드는 당신이 원하는하지 않을 수 있습니다 B의 핸들러의 모든를 제거하는 부작용이 . 특정 처리기 만 제거하는보다 강력한 버전은 익명 처리기가 아닌 명명 된 처리기를 만들고 추가하고 제거하는 것입니다. 이렇게하면 원하는 특정 처리기를 타겟팅 할 수 있습니다. 네임 스페이스를 사용하여이 작업을 수행 할 수도 있습니다 (unbind에 대한 설명서를 참조하고 "네임 스페이스"참조).

var helloHandlerForB = function() { console.log("hello"); }; 

$('A').click(function(){ 
    // Ensure we only ever have one click-handler on B 
    // by clearing existing handlers before adding our 
    // new one. 
    $('B').unbind('click', helloHandlerForB).click(helloHandlerForB); 
}) 

Answer 3

또한 부울을 클릭하여 확인했는지 확인할 수 있습니다.

예 : fiddle

var aIsClicked = false; //boolean 

$('#A').click(function(){ 
    $('#log').html('clicked on A'); 
    aIsClicked = true; 
}); 

$('#B').click(function(){ 
    if(aIsClicked) //check if a was clicked 
    { 
     $('#log').html('clicked on B and A was clicked'); 
     alert("hello"); 
    } 
    else 
    { 
     $('#log').html('clicked on B and A was not clicked'); 
    } 
});​