Во-первых, ваш HTML-код недействителен.Входные теги являются самозакрывающимися, и li элементы должны находиться внутри списка ul или ol, а не div элемента.
<input type="hidden" id="current_page" />
<input type="hidden" id="show_per_page" />
<ul id="content"></ul>
Во-вторых, ваши события щелчка не получаютобработано, потому что go_to_page, next и previous не находятся в глобальной области видимости.Вы должны создать эти элементы и прикрепить обработчики кликов.
$("<a href='#'>Prev</a>").click(previous).appendTo("#page_navigation");
while (number_of_pages > current_link) {
$("<a href='#' class='page_link'>").text(++current_link).click(go_to_page).appendTo("#page_navigation")
}
$("<a href='#'>Next</a>").click(next).appendTo("#page_navigation");
Еще один совет: реструктурируйте функции prev и next, чтобы просто щелкнуть номер предыдущей или следующей страницы.Таким образом, this в go_to_page всегда указывает на пейджинговую ссылку.
function previous(e) {
e.preventDefault(); //Don't follow the link
$(".active_page").prev(".page_link").click();
}
function next(e) {
e.preventDefault();
$(".active_page").next(".page_link").click();
}
function go_to_page(e) {
e.preventDefault();
//Get the zero-based index instead of using an attribute
var page_num = $(this).index(".page_link");
//get the number of items shown per page
var show_per_page = parseInt($('#show_per_page').val());
//get the element number where to start the slice from
start_from = page_num * show_per_page;
//get the element number where to end the slice
end_on = start_from + show_per_page;
//hide all children elements of content div, get specific items and show them
$('#content').children().hide().slice(start_from, end_on).show();
//Since this always points to the page link, use that instead of looking for it
$(this).addClass("active_page").siblings(".active_page").removeClass("active_page");
//update the current page input field. Don't need this anymore since we can use the .active_page class to identify it.
//$('#current_page').val(page_num);
}
JSFiddle с удаленной частью AJAX.