Javascript 主干分页一次10个
我正在主干网中构建分页。问题是，页面数量已经增加，而且现在很多，这破坏了网站的布局。因此，我想实现一个功能，我可以渲染前10页，然后使用next/prev按钮控制显示哪些页码。但始终仅显示10页，如下所示： <1234567810> <2 3 4 5 6 7 8 9 10 11> 所以现在我把它附加到我的分页中（它的所有页面） 我就是这样用html（下划线.js）打印出来的Javascript 主干分页一次10个,javascript,backbone.js,underscore.js,Javascript,Backbone.js,Underscore.js,我正在主干网中构建分页。问题是，页面数量已经增加，而且现在很多，这破坏了网站的布局。因此，我想实现一个功能，我可以渲染前10页，然后使用next/prev按钮控制显示哪些页码。但始终仅显示10页，如下所示： 所以现在我把它附加到我的分页中（它的所有页面） 我就是这样用html（下划线.js）打印出来的 ◄ ► 我有一个代表当前页面的变量，我知道页面总数。但我不知道如何实现我所说的我的问题 任何人都知道如何做到这一点，可以举个例子吗？非常感谢 您可以这样做：
-
◄
►
任何人都知道如何做到这一点，可以举个例子吗？非常感谢 您可以这样做：
updateTotal: function () {
var self = this;
self.totalModel.fetch({
success:function(model,response) {
var total = response.data; //all iems
var p = total/self.perPage;
var r = total-Math.round(p);
var c = ... // current page
self.pagination = _.template($("#pagination_template").html(), {
pages:Math.ceil(p),
current: c
});
self.render();
}
});
},
<script type="text/template" id="pagination_template">
<section class="pagination">
<ul>
<%
var renderPage;
for (var i = 1; i <= pages; i++) {
renderPage = false;
if (pages < 10) {
renderPage = true;
} else {
if (current <= 5) {
if (i < 10) {
renderPage = true;
}
} else if (current <= pages - 5) {
if ((current - 5) < i || (current + 5) > i) {
renderPage = true;
}
} else {
if ((pages - 9) < i) {
renderPage = true;
}
}
};
if (renderPage) { %>
<li>
<a href="#" data-offset="<%= i*9 %>" data-page="<%= i %>">
<%= i %>
</a>
</li>
<% }
} %>
</ul>
<div class="paging prev">◄</div>
<div class="paging next">►</div>
</section>
</script>
您可以添加一些增强功能，这只是全局算法，谢谢！我现在就去。不幸的是，它说“当前”在下划线中没有定义。我不是下划线专家。可能其中缺少一些语法？已设置
var c=…/当前页面
？是。我没有定义。即使我尝试将其设置为某个int（如果我的实际currentPage未定义），但我仍然未定义。尝试此current:c | | 1
，因此如果当前页面未定义，它将初始化为1。
updateTotal: function () {
var self = this;
self.totalModel.fetch({
success:function(model,response) {
var total = response.data; //all iems
var p = total/self.perPage;
var r = total-Math.round(p);
var c = ... // current page
self.pagination = _.template($("#pagination_template").html(), {
pages:Math.ceil(p),
current: c
});
self.render();
}
});
},
<script type="text/template" id="pagination_template">
<section class="pagination">
<ul>
<%
var renderPage;
for (var i = 1; i <= pages; i++) {
renderPage = false;
if (pages < 10) {
renderPage = true;
} else {
if (current <= 5) {
if (i < 10) {
renderPage = true;
}
} else if (current <= pages - 5) {
if ((current - 5) < i || (current + 5) > i) {
renderPage = true;
}
} else {
if ((pages - 9) < i) {
renderPage = true;
}
}
};
if (renderPage) { %>
<li>
<a href="#" data-offset="<%= i*9 %>" data-page="<%= i %>">
<%= i %>
</a>
</li>
<% }
} %>
</ul>
<div class="paging prev">◄</div>
<div class="paging next">►</div>
</section>
</script>