Events when scrolling to the bottom of the ons-list

Thank you for your help.
Let me ask you a question.

monaca is using onsen-ui.
I'd like to take an event when I scroll to the bottom of the ons-list, but how do you implement it?
Scroll to the bottom → auto load I want to implement this common feature.

$(window).on("load scroll",hove);
could not get the scroll value.
Previous (https://monaca.mobi/ja/forum/q/52ea3b8a7e2193dd37eea8d1)

For now, just to implement this feature,
I am using iscroll.js instead of ons-list.

Please let me know.

ios monaca onsen-ui

2022-09-30 19:32

2 Answers

1. misspelling
scroll→scroll

2. With Onsen-UI, can you do the following?

$("#scroll_test").on("scroll", function(){
	console.log("change:"+scroll_test.scrollTop);
	// Scroll maximum == scroll area size + scroll value
	if(scroll_test.scrollHeight<=scroll_test.clientHeight+scroll_test.scrollTop) {console.log("scroll max");}
});

<ons-scroller id="scroll_test" style="height:200px;width:100%">ons-list>
	<ons-list-header>Header Text</ons-list-header>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
	</ons-list>
	<ons-list-header>Header Text2</ons-list-header>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
		<ons-list-item>Item</ons-list-item>
	</ons-list>
</ons-scroller>

2022-09-30 19:32

If you are using onsen-ui, why don't you try using the angular Directive?
There is a sample at the URL on the right.http://jsfiddle.net/vojtajina/U7Bz9/

2022-09-30 19:32

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656