Jquery 이벤트 바인딩 해제

Question

두 ID에 이벤트를 한 번에 바인딩합니다. 사실을 알기 위해 하나의 ID를 대상으로 이벤트 바인딩을 해제하는 방법이 있습니까?

다음은 간단한 코드입니다. 하나의 이벤트는 AJAX 요청이 HTML 템플릿을 반환 한 후에 언 바운드/바인딩됩니다 ... 템플릿 'AA'가 렌더링되면 첫 번째 이벤트가 바인딩됩니다. 템플릿 'BB'가 렌더링되면 두 번째 스크립트가 바인딩됩니다.

//Template AA 
$('#container').off('dblclick', '#store, #compare_store'); 
$('#container').on('dblclick', '#store, #compare_store', function(){ 
    console.dir('test1'); 
}); 

//Template BB 
$('#container').off('dblclick', '#store'); //This does not unbind the event listed as above 
$('#container').on('dblclick', '#store', function(){ 
    console.dir('test2'); 
}); 

/* Console Output When double-clicking '#store': 
    test1 
    test2 
*/ 

'#store'요소를 두 번 클릭하면 두 이벤트가 모두 트리거됩니다. 원하는 효과는 두 번째 이벤트가 첫 번째 이벤트를 바인딩 해제하고 (#store 전용) 새 이벤트를 바인딩하는 것입니다.

각 ID를 개별적으로 바인딩하면 원하는 결과를 얻을 수 있다는 점을 알고 있습니다. 또한 클래스를 사용하면 작업을 수행한다는 것도 알고 있습니다.

미리 감사드립니다.

Answer 1

장에게 선택기를 off 메서드 호출이 on 선택 일치하도록 : 원래 선택에 대한 바인딩을 해제하는 경우

//Template AA 
$('#container').on('click', '#compare_store', function(){ 
    console.log("a", this); 
}).on('click', '#store', function(){ 
    console.log("b", this); 
}); 

//Template BB 
$('#container').off('click', '#store'); //This does not unbind the event listed as above 

http://jsfiddle.net/xzgnH/