Why scroll event not working in UI5 sap.m.Page?

问题:

Demo

I am trying to attach scroll event in my UI5 Page, but it is not fired:

 onInit: function() {
   $(window).scroll(function() { 
      console.log("scrolled")
   });
 },

 onAfterRendering: function() {
   //Or
   var oPage = this.getView().byId("myPage");
   oPage.attachBrowserEvent("window.onscroll", function(oEvent) {
      console.log("onscoll");
   });  
 }

回答1:

The event "window.onscroll" should be changed to the "scroll" event in your code.

oPage.attachBrowserEvent("scroll", function(oEvent) {
  console.log("onscoll");
});

Also when you attach an event listener on the page it would not fire as the event is attached on the parent div element of the Page control. This control's content consists of a header & a section tag which spans a combined height equivalent to its parent. So the page itself will not scroll. However the content inside the section tag will scroll, if content exceeds available height.

So you could either use a Scroll Container on which you could have a scroll event or attach a event listener on the section tag of the page.

$("#"+oPage.sId+" section").scroll(function(oEvent) {
    console.log("on content scroll");
});