Onsen UI ScrollTop 값이 작동하지 않습니다.

Question

스크롤하여 스크롤 탑 값을 얻으려고합니다.하지만 ons-splitter 다중 페이지에서는 작동하지 않는 것 같습니다.

ons-splitter 및 ons-template 태그를 제거하려고했지만 ons-page 만 사용하면 작동합니다.

나는 onsenui 프레임 워크 및 jquery와 함께 cordova를 사용하고 있습니다. 아무도 나를 도울 수 있습니까? 여기

내 코드입니다.

<ons-splitter> 
    <ons-splitter-side id="menu" side="left" width="220px" collapse swipeable> 
    <ons-page> 
     <ons-list> 
     <ons-list-item onclick="fn.load('home.html'); " tappable> 
      Home 
     </ons-list-item> 
     <ons-list-item onclick="fn.load('settings.html')" tappable> 
      Settings 
     </ons-list-item> 
     </ons-list> 
    </ons-page> 
    </ons-splitter-side> 
    <ons-splitter-content id="content" page="home.html"></ons-splitter-content> 
</ons-splitter>  
<ons-template id="home.html"> 
    <ons-page id="home"> 
    <ons-toolbar> 
     <div class="left"> 
     <ons-toolbar-button onclick="fn.open()"> 
      <ons-icon icon="md-menu"></ons-icon> 
     </ons-toolbar-button> 
     </div> 
     <div class="center"> 
     Home 
     </div> 

     <div class="right"> 
     <span class="glyphicon glyphicon-time header-icon"><span class="badge"></span></span> 
     </div> 
    </ons-toolbar> 
    <div class="page__content home-content-div" id="home-content-div"> 
    <ons-pull-hook class="pull-hook-home" id="pull-hook-home"> 
     Pull to refresh 
     </ons-pull-hook> 
     <ons-scroller> 
     <div class="main row ons-scroller__content ons-scroller-inner" id="infinite-list-home"> 
     <style> 
      .infinite-item { 
       padding: 100px; 
       background-color: aquamarine; 
       margin-bottom: 20px; 
      }  
     </style> 
      <div class="wrapper" style="position:fixed;"> 
      <div class="horizontalScroll">Scroll (x,y) to </div> 
      <div class="verticalScroll">see me in action</div> 

     </div> 

     <div style="position:absolute;width: 200%;height: 10px;"></div> 

      <div class=""> 
       <div class="infinite-item">1</div> 
       <div class="infinite-item">2</div> 
       <div class="infinite-item">3</div> 
       <div class="infinite-item">4</div> 
       <div class="infinite-item">5</div> 
       <div class="infinite-item">6</div> 
       <div class="infinite-item">7</div> 
       <div class="infinite-item">8</div> 
       <div class="infinite-item">9</div> 
       <div class="infinite-item">10</div> 
     </div> 
     </div> 

     </ons-scroller> 
     </div> 
    </ons-page> 
</ons-template>  



<ons-template id="settings.html"> 
    <ons-page> 
    <ons-toolbar> 
     <div class="left"> 
     <ons-toolbar-button onclick="fn.open()"> 
      <ons-icon icon="md-menu"></ons-icon> 
     </ons-toolbar-button> 
     </div> 
     <div class="center"> 
     Settings 
     </div> 
    </ons-toolbar> 
    </ons-page> 
</ons-template> 
<script src="lib/jquery.min.js"></script> 
<script src="lib/onsenui/js/onsenui.js"></script> 
<script src='https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.11/build/js/angular/angular.min.js'></script> 


    <script> 

    ons.ready(function(){ 
     var content = document.querySelector('.home-content-div'); 
     var horizontalScroll = document.querySelector(".horizontalScroll"); 
     var verticalScroll = document.querySelector(".verticalScroll"); 

     content.addEventListener("scroll", function(e) { 
    horizontalScroll.innerHTML = "Scroll X: " + content.scrollLeft + "px"; 
    verticalScroll.innerHTML = "Scroll Y: " + content.scrollTop + "px"; 
     }); 
    }); 
    </script> 

Answer 1

$ ('기능 페이지') scrollTop (0);

내 프로젝트에서 나는 ons-splitter와 ons-template을 사용하고 있습니다.

모든 페이지에서 해당 줄과 같은 코드를 사용하여 페이지 맨 위로 스크롤 할 수 있습니다. 당신은 스크롤 이벤트 리스너를 사용해야 할 경우

는하지만, 이것은 나를 위해 일했다 $ 스크롤 (함수() {

}) ('page__content를..');