选择性页面无限滚动
Selective page endless scrolling
我使用以下 javascript 在多个页面上实现了无限滚动,效果很好。
$(document).ready(function() {
if ($('.pagination').length) {
$(window).scroll(function() {
var url = $('.pagination .next_page').attr('href');
if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
$('.pagination').text("Please Wait...");
return $.getScript(url);
}
});
return $(window).scroll();
}
});
这放在我的 application.js 文件中。
我刚刚意识到我在其他页面上有一些分页链接,我不希望无休止地滚动,但是它们被替换为 "Please Wait..."
是否可以仅在某些页面或控制器上激活上述代码?
给你的will_paginate
一个独特的#id
,这样他们就不会都使用.pagination
,这就是其他无尽卷轴附加"please wait"的原因。
示例:
<%= will_paginate @posts, :params => {:controller => 'posts', :action => 'index'}, id: "posts_pagination"%>
在这里您还可以看到如何将 will_paginate 委托给某个控制器和操作。
will_paginate doesn't always play ball with adding an #id
so you might
want to try and add a .class
instead:
<%= will_paginate @posts, :params => {:controller => 'posts', :action => 'index'}, class: "posts_pagination"%>
然后在您的 application.js
中 – 将 infinity-script 绑定到 #posts-pagination
(如果 #id
)或 .posts_pagination
(如果 .class
)而不仅仅是 .pagination
:
收藏
我使用以下 javascript 在多个页面上实现了无限滚动,效果很好。
$(document).ready(function() {
if ($('.posts-pagination').length) {
$(window).scroll(function() {
var url = $('.posts-pagination .next_page').attr('href');
if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
$('.posts-pagination').text("Please Wait...");
return $.getScript(url);
}
});
return $(window).scroll();
}
});
您可能想根据您的情况给 url
一个唯一的变量,这样每个无限卷轴就不会获取另一个无限卷轴的 url
只是改变var url = $('.posts-pagination .next_page').attr('href');
至:
var url1 = $('.posts-pagination .next_page').attr('href');
var url2 = $('.comments-pagination .next_page').attr('href');
以此类推
瞧瞧。你可以开始了。
我使用以下 javascript 在多个页面上实现了无限滚动,效果很好。
$(document).ready(function() {
if ($('.pagination').length) {
$(window).scroll(function() {
var url = $('.pagination .next_page').attr('href');
if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
$('.pagination').text("Please Wait...");
return $.getScript(url);
}
});
return $(window).scroll();
}
});
这放在我的 application.js 文件中。
我刚刚意识到我在其他页面上有一些分页链接,我不希望无休止地滚动,但是它们被替换为 "Please Wait..."
是否可以仅在某些页面或控制器上激活上述代码?
给你的will_paginate
一个独特的#id
,这样他们就不会都使用.pagination
,这就是其他无尽卷轴附加"please wait"的原因。
示例:
<%= will_paginate @posts, :params => {:controller => 'posts', :action => 'index'}, id: "posts_pagination"%>
在这里您还可以看到如何将 will_paginate 委托给某个控制器和操作。
will_paginate doesn't always play ball with adding an
#id
so you might want to try and add a.class
instead:
<%= will_paginate @posts, :params => {:controller => 'posts', :action => 'index'}, class: "posts_pagination"%>
然后在您的 application.js
中 – 将 infinity-script 绑定到 #posts-pagination
(如果 #id
)或 .posts_pagination
(如果 .class
)而不仅仅是 .pagination
:
收藏 我使用以下 javascript 在多个页面上实现了无限滚动,效果很好。
$(document).ready(function() {
if ($('.posts-pagination').length) {
$(window).scroll(function() {
var url = $('.posts-pagination .next_page').attr('href');
if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
$('.posts-pagination').text("Please Wait...");
return $.getScript(url);
}
});
return $(window).scroll();
}
});
您可能想根据您的情况给 url
一个唯一的变量,这样每个无限卷轴就不会获取另一个无限卷轴的 url
只是改变var url = $('.posts-pagination .next_page').attr('href');
至:
var url1 = $('.posts-pagination .next_page').attr('href');
var url2 = $('.comments-pagination .next_page').attr('href');
以此类推
瞧瞧。你可以开始了。