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

$（ 'ONS-ページ'）scrollTopスプライト（0）;

私のプロジェクトでは、ons-splitterとons-templateを使用しています。

どのページでも、その行のようなコードを使ってページの上部までスクロールすることができます。

しかし、あなたは、スクロールイベントリスナーを使用する必要がある場合、これは私のために$を取り組んできました（ 'page__content'）スクロール（関数（）{

}）;