javascript - jQuery动态分页

Question

我使用这个插件来分页我的<li>：http ://www.jquery4u.com/tutorials/jquery-quick-pagination-list-items/

从带有方法的select选项派生的列表。onchange如果我更改选项，它将根据其值生成一个列表。

这是我用来生成列表的 jquery 代码：

jQuery('#group').change(function() {
   var id_group = this.value; 
   var memberjson = "fetchmember.php?group="+id_group;

   jQuery.getJSON(memberjson,function(data){

     jQuery.each(data, function(i, item) {
     jQuery("#fetchmember").append("<li>"+item.name+"</li>");
     });
   }); 
});

html代码：

<ul class="pagination3" id=fetchmember"></ul>

jQuery 配置（用于分页）

jQuery(document).ready(function() {
   jQuery("ul.pagination3").quickPagination({pagerLocation:"both",pageSize:"5"});
});

我的代码有什么问题？它不能工作，但如果我创建<li>像这样的静态：

<ul class="pagination3" id=fetchmember">
<li>ONE</li>
<li>TWO</li>
<li>THREE</li>
</ul>

分页可以很好地工作。请帮忙。

谢谢

Answer 1

试试这个

添加这个你的函数调用

$("ul.pagination3").quickPagination({pagerLocation:"both",pageSize:"5"});

然后代码将是

jQuery('#group').change(function() {
   var id_group = this.value; 
   var memberjson = "fetchmember.php?group="+id_group;

   jQuery.getJSON(memberjson,function(data){

     jQuery.each(data, function(i, item) {
     jQuery("#fetchmember").append("<li>"+item.name+"</li>");
     $("ul.pagination3").quickPagination({pagerLocation:"both",pageSize:"5"});//now we have li elements in dom so it will work
     });
   }); 
});