如何實現報表滾動到底部進行翻頁的效果

報表資料分多頁在頁面中顯示，為了使用者翻看資料方便，報表頁面都會有按鈕，方便使用者點選按鈕檢視其他頁的資料，按鈕的翻頁方式比較常見，潤乾報表展現頁面提供的就是這種方式。

這裡介紹另一種翻頁方式，滑鼠滾動來翻頁檢視資料。
基本實現思路就是在報表展現頁面中加滑鼠滾動事件，滾到底就呼叫潤乾自帶的函式。
在報表展現的頁面 showReport.jsp 中新增下面的 JS：

if (window.addEventListener)//FF,火狐瀏覽器會識別該方法
    window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;//W3C
//統一處理滾輪滾動事件
function wheel(event){
    var delta = 0;
    if (!event) event = window.event;
    if (event.wheelDelta) {//IE、chrome瀏覽器使用的是wheelDelta，並且值為“正負120”
        delta = event.wheelDelta/120; 
        if (window.opera) delta = -delta;//因為IE、chrome等向下滾動是負值，FF是正值，為了處理一致性，在此取反處理
    } else if (event.detail) {//FF瀏覽器使用的是detail,其值為“正負3”
        delta = -event.detail/3;
    }
    if (delta)
        handle(delta);
}
//上下滾動時的具體處理函式
function handle(delta) {
if (delta <0){//向下滾動
      nextPage('report1');  
    }else{//向上滾動
       prevPage('report1'); 
    }
}

報表屬性中設定報表分頁方式為按行分頁，每頁顯示 30 行的報表，在頁面上的分頁及拖動滑鼠分頁的效果如下。

頁面新增上面的 JS 後，就可以在瀏覽器中使用 showReport.jsp 訪問報表，上下滾動滑鼠滑輪，就可以暢爽的翻頁檢視資料了。

對進一步報表和 BI 技術感興趣的同學還可以搜尋“乾學院”，上面有整套的免費“商業智慧”技術課程,. 或者直接點下面的連結也可以 ：