Question

所以，我的问题如下。它遵循之前的HERE＆amp; HERE

我使用此代码从XML获得了动态添加表：

$.ajax({
    type: "GET",
    url: "../datas/_pizzas",
    dataType: "xml",
    success: function(xml) {
        $(xml).find('row').each(function() {
            var getNom = $(this).find('nomp').text();
            var Prix1 = $(this).find('petit').text();
            var Prix2 = $(this).find('moyen').text();
            var Prix3 = $(this).find('grand').text();
            $('<table id="item"></table>').html('<tr><td id="test" onclick="afficher(\''+getNom +'\','+Prix1+','+Prix2+','+Prix3+');"><b>' + getNom + '</b></td></tr>').appendTo('#pizzas');
        });
    }
});

我需要限制页面上的数量。如果可能的话，还有一个索引导航。我搜索了一个可以解决问题的分页插件，但我找不到任何适合我，太多无用的配置，或者对我来说都不可读。

有人有代码或为我解释????

Answer 1

Working demo

<强> CODE：

//For Stackoverflow Community
//Fork Fork Fork Fork !
item = $('table'); //Any element you want
itemL = item.length; //Get the Item count
itNbr = 5; //Set the Item per page
pgNbr = 0; //Set the page count to 0


//Hide unwanted row
function start() {
    if (itemL > itNbr) { //If Items Count greater than Item per page
        item.hide(); //Hide All Items
        item.slice(0, itNbr).show(); //Show only the 0 to 'X'. X = Item per page
        pgNbr = Math.ceil(itemL / itNbr); //Get the page Number Item Count / Item per Page round to Greater
        thisPage = 1; //Set the Start Page
    }
}


//Get the pages Index
function indexer() {
    $('textarea').val(thisPage + ' / ' + pgNbr); //Sipmply set val.
}
//Bind the action
$('.pager').click(function() {
    //Create loop
    if (thisPage == pgNbr) { //If last page 
        start(); //Go 1st
        indexer(); //Get Index
    }
    else {
        var first = itNbr * thisPage; //Define the first visible item 'X'
        var last = (itNbr * thisPage) + itNbr; //Define the last visible item 'Y'
        item.hide(); //Hide All
        item.slice(first, last).show(); //Show only 'X' to 'Y'
        thisPage++; //Increment page number
        indexer(); //And get the index
    }

});

//Let's GO !
start();
indexer();

jQuery Easy分页没有插件

1 个答案: