分頁號碼沒有正確更新

Question

嘿，我試圖讓我的分頁號碼更新，當用戶在頁面的一側使用過濾器選項。

這裏是我的工作：Click Here

的問題是，當你點擊的顏色 - 黃色 - 你應該只得到1次的結果（巨人），只有1頁碼應該顯示。但分頁沒有正確更新，仍然顯示所有頁碼。

編輯：

我已經放在paginateIt（）函數的過濾器腳本的結束，但現在我得到一個無響應腳本警告

我有我最近的變化更新腳本如下：

$(document).ready(function(){ 

function paginateIt(){ 
//how much items per page to show 
var show_per_page = 3; 
//getting the amount of elements inside content div 
var number_of_items = $('#content ul').filter(":not(.hidden)").children().size(); 

//calculate the number of pages we are going to have 
var number_of_pages = Math.ceil(number_of_items/show_per_page); 

//set the value of our hidden input fields 
$('#current_page').val(0); 
$('#show_per_page').val(show_per_page); 

//now when we got all we need for the navigation let's make it ' 

/* 
what are we going to have in the navigation? 
    - link to previous page 
    - links to specific pages 
    - link to next page 
*/ 
var navigation_html = '<a class="previous_link" href="javascript:previous();">Prev</a>'; 
var current_link = 0; 
while(number_of_pages > current_link){ 
    navigation_html += '<a class="page_link" href="javascript:go_to_page(' + current_link +')" longdesc="' + current_link +'">'+ (current_link + 1) +'</a>'; 
    current_link++; 
} 
navigation_html += '<a class="next_link" href="javascript:next();">Next</a>'; 

$('#page_navigation').html(navigation_html); 

//add active_page class to the first page link 
$('#page_navigation .page_link:first').addClass('active_page'); 

//hide all the elements inside content div 
$('#content ul').filter(":not(.hidden)").children().css('display', 'none'); 

//and show the first n (show_per_page) elements 
$('#content ul').filter(":not(.hidden)").children().slice(0, show_per_page).css('display', 'block'); 

// Start filter script 
(function($) { 

    $.fn.randomize = function(){ 
    return $(this).sort(function() {return 0.5 - Math.random()}); 
    } 

    $.fn.filterprojects = function(settings) { 
    settings = $.extend({ 
     animationSpeed: 900, 
     animationPulse: 100, 
     animationEase: "linear", 
     activeClass: "active", 
     allTag: "all", 
     randomize: true, 
     show: { width: "show", opacity: "show" }, 
     hide: { width: "hide", opacity: "hide" }, 
     filterTagSelector: [] // specify at least one 
     }, settings); 

     $(this).each(function(i, o){ 
     var _elements = $(this).children(); 

     /* Binding the filter */ 
     $(this).bind("filter", function(){ 
      var _groups = []; 
      var _filtered_elements = _elements; 
      $.each(settings.filterTagSelector, function(k, j){ 
      _groups[k] = []; 
      $(this + "." + settings.activeClass).each(function(){ 
       if(!$(this).hasClass(settings.allTag) && this.hash != undefined) { _groups[k].push(this.hash.substring(1)); } 
      }); 
      if(_groups[k].length > 0){ 
       _filtered_elements = _filtered_elements.filter("." + _groups[k].join(",.")); 
      } 
      }); 

      /* Randomize */ 
      if(settings.randomize){ 
      _filtered_elements = _filtered_elements.randomize(); 
      _elements = _elements.randomize(); 
      } 
      /* Show */ 
      _filtered_elements.each(function(i,o){ 
      $(this).queue(function(){ 
       $(this).animate({left: "+0"}, (settings.animationPulse*i)); // dirty trick :) 
       $(this).animate(settings.show, settings.animationSpeed); 
       $(this).dequeue() 
      }); 
      }); 

      /* Hide */ 
      _elements.not(_filtered_elements).each(function(i,o){ 
      $(this).queue(function(){ 
       $(this).animate({left: "+0"}, (settings.animationPulse*i)); // dirty trick :) 
       $(this).animate(settings.hide, settings.animationSpeed); 
       $(this).dequeue() 
      }); 
      }); 
     }); 
     /* Setup filter selectors */ 
     $.each(settings.filterTagSelector, function(k, j){ 
      $(""+this).click(function(e){ 
      e.preventDefault(); 
      if($(this).hasClass(settings.allTag)){ 
       $(j).removeClass(settings.activeClass); 
       $(this).addClass(settings.activeClass); 
      } else { 
       $(this).hasClass(settings.activeClass) ? $(this).removeClass(settings.activeClass) : $(this).addClass(settings.activeClass); 
       $(j+"."+settings.activeClass).length > 0 ? $(j+"."+settings.allTag).removeClass(settings.activeClass) : $(j+"."+settings.allTag).addClass(settings.activeClass); 
      } 
      /* Triggering the filter */ 
      $(o).trigger("filter"); 
      }) 
     }); 
     }); 
     return this 
    }; 
})(jQuery); // End filter script 
paginateIt(); 
} // End PaginateIt script 
paginateIt(); 


}); // End of JS script. 

function previous(){ 

new_page = parseInt($('#current_page').val()) - 1; 
//if there is an item before the current active link run the function 
if($('.active_page').prev('.page_link').length==true){ 
    go_to_page(new_page); 
} 

} 

function next(){ 
new_page = parseInt($('#current_page').val()) + 1; 
//if there is an item after the current active link run the function 
if($('.active_page').next('.page_link').length==true){ 
    go_to_page(new_page); 
} 

} 
function go_to_page(page_num){ 
//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 ul').filter(":not(.hidden)").children().css('display', 'none').slice(start_from, end_on).css('display', 'block'); 

/*get the page link that has longdesc attribute of the current page and add active_page class to it 
and remove that class from previously active page link*/ 
$('.page_link[longdesc=' + page_num +']').addClass('active_page').siblings('.active_page').removeClass('active_page'); 

//update the current page input field 
$('#current_page').val(page_num); 
} 

Answer 1

由於paginateIt負責渲染頁面下方的數字，你不應該把它每次新過濾器被應用？