2017-03-29 4 views
0

안녕을 작동하지 않습니다 I했습니다 다음과 같은 HTML 구조 : 나는 코드으로 스 와이프 이벤트 전파

var myElement = $(".container")[0]; 
      var hammertime = new Hammer(myElement);    
      hammertime.on("swiperight",function(){ 
       console.debug(" manage swiperight event.");     
       }); 

를 사용하여 클래스 컨테이너 DIV에 슬쩍 이벤트를 결합하면

<div class="container"> 

     <div class="scroller"> 
      <div id ="goldenPage" class="page active">    
       <div class="block text"> 
        <div class="rich-text"></div> 
       </div> 
       <div class="block"> 
        <div class="form"></div> 
       </div> 
       <div class="block"> 
        <ul class="menu"></ul> 
       </div> 
      </div> 
      <div id ="cachePage" class="page"></div> 
     </div> 

    </div> 

및 만약 아무것도 스크롤하지 않으면 (scroller 클래스를 가진 내부 div는 parent div보다 키가 작기 때문에 나는 페이지의 아래쪽을 스 와이프해야한다.) div에있는 스와 이브를 클래스 스크롤러로 바인딩하면 스 와이프가 올바르게 바인딩됩니다. 스크롤러 div는 jquery scrollpane plugin과 바인드됩니다. 어떤 아이디어?!

+0

그래서 질문이 바로 여기에 무엇 : jQuery를 사용

, 이것은 당신의 자바 스크립트 코드를 포장함으로써 달성 될 수있다? 당신이하고있는 일을하는 이유를 묻고 있습니까? 또는 스 와이프를 컨테이너 div에 바인딩하고 여전히 올바르게 작동하는 방법을 묻고 있습니까? –

답변

0

DEMO - document.ready 이벤트 이후에 자바 스크립트/jQuery가 실행되는지 확인하십시오.

DOM에서 요소를 사용할 수있게되기 전에 JavaScript가 실행되면 JavaScript가 해당 요소를 찾지 못하므로 (swiperight) 이벤트를 요소에 바인딩 할 수 없습니다.

$(function() { 
    // Your code here. 
    console.log("Ready!"); 
}); 
관련 문제