하나를 제외한 여러 요소에 이벤트 수신기 추가

Question

phonegap 및 Zepto로 모바일 응용 프로그램을 개발 중이며 한 가지 문제로 고민 중입니다. 왼쪽과 오른쪽에 사이드 메뉴가 있으며, 이는 스 와이프로 표시됩니다. 그러나, 내 주요 컨테이너에, 나는 슬쩍과 함께 작동 작은 슬라이더가 있습니다. 내 문제는 슬라이더 컨테이너를 스 와이프하자 마자 사이드 메뉴에 대한 스 와이프 이벤트가 호출되고 메뉴가 표시된다는 것입니다. 이 문제를 방지하는 방법이 있습니까?

코드 : 당신이 그것을 사용할 수 있도록

Zepto(document).on('swipeRight', function(){ 
    if($('#search-container').hasClass('back-left')) 
     handleSideSearchMenu(); 
    else if(!$(showLeft).hasClass('active')) 
     MyObj.handleSideMenu(showLeft); 
}).on('swipeLeft', function(){ 
    if($('#search-container').hasClass('to-right') && !$(showLeft).hasClass('active')) 
     handleSideSearchMenu(); 
    else if($(showLeft).hasClass('active')) 
     MyObj.handleSideMenu(showLeft); 
}); 

Answer 1

당신이 할 수있는 ... 위의 코드에서

Zepto(document).on('swipeRight', function(e) { 

    if ($(e.target).is(**slider-container**)) return; 

    if($('#search-container').hasClass('back-left')) 
     handleSideSearchMenu(); 
    else if(!$(showLeft).hasClass('active')) 
     MyObj.handleSideMenu(showLeft); 

}).on('swipeLeft', function(e){ 

    if ($(e.target).is(**slider-container**)) return; 

    if($('#search-container').hasClass('to-right') && !$(showLeft).hasClass('active')) 
     handleSideSearchMenu(); 
    else if($(showLeft).hasClass('active')) 
     MyObj.handleSideMenu(showLeft); 
}); 

, e.target는 이벤트를 실행 한 DOM 요소입니다 무시하려는 요소가 있는지 확인하십시오.

마크 업을 보지 않고는 더 이상 도움이되지 않습니다. **slider-container**을 무시하려는 요소를 식별하는 항목으로 바꿔야합니다.