所以我的问题是,当用户点击下一个按钮时,它不会移动分页。
这是我的小提琴http://jsfiddle.net/jfm9y/821/所以任何建议如何解决这个问题?当我点击下一个或上一个时它会移动内容,但我无法获得突出显示的数字。
var pageSize = 3;
var currentpage = 1;
var pagecount = 0;
var page_count = document.getElementById('page_count').value;
showPage = function (page) {
$(".content").hide();
$(".content").each(function (n) {
if (n >= pageSize * (page - 1) && n < pageSize * page)
$(this).show();
});
}
showPage(1);
$("#pagin li a.numbers").click(function () {
$("#pagin li a.numbers").removeClass("current");
$(this).addClass("current");
showPage(parseInt($(this).text()));
});
$("#pagin").on("click", "a", function (event) {
if ($(this).html() == "next") {
$("#pagin li a.numbers").removeClass("current");
currentpage++;
console.log(currentpage);
}
else if ($(this).html() == "prev") {
currentpage--;
}
else {
currentpage = $(this).html();
}
if (currentpage < 1) {
currentpage = 1;
}
if (currentpage > page_count) {
currentpage = page_count;
}
showPage(currentpage);
});
答案 0 :(得分:2)
只需为每个按钮添加ID即可。像这样举例如:
<li><a id="btn1" class="current" href="#">1</a></li>
<li><a id="btn2" href="#">2</a></li>
<li><a id="btn3" href="#">3</a></li>
<li><a id="btn4" href="#">4</a></li>
并在showPage(currentpage);
$(".current").removeClass("current");
$("#btn"+currentpage).addClass("current");