Question

我有一个页面，其中包含产品类别和子类别的菜单。类别具有类“类别”，子类别具有类“子类别”。当点击其中任何一个时，一些AJAX将类别发送到某个php来编译html，然后AJAX将其发送回页面以填充div。这部分工作正常。

代码中有一个函数可以拆分返回的记录。所以说有6条记录，页面一次显示2条，那么有3页。我显示正确的页面数量（1 2 3），但每个页面都显示6条记录！

有人能看到问题吗？

$('a.category, a.subcategory').click(function (e) {
    // first stop the link to go anywhere
    e.preventDefault();
    // get the class of the link
    var linkClass = $(this).attr("class");
    //get the text of the link by converting the clicked object to string
    var linkText = new String(this);
    // the value after the last / is the category ID
    var categoryValue = linkText.substring(linkText.lastIndexOf('/') + 1);
    // put the post parameters into 'params' to pass through the AJAX post request
    var params = {};
    params[linkClass] = categoryValue;
    // send the category ID to the getProductData.php script using jquery ajax post method
    // send along a category ID
    // on success insert the returned text into the chosen div
    $.post('../inc/showproducts.php', params, function (data) {
        //find total number of records
        var totalRecords = $(data).length;
        //define how many records shown per page
        var pageSize = 2
        //work out number of pages needed to hold records
        var numOfPages = Math.ceil(totalRecords / pageSize);
        //make page links
        var i,
        pageLinks = '<div class="pageLinks">';
        for (i = 0; i < numOfPages; i++) {
            pageLinks += '<a href="#" onclick="showProductPage(' + i + ');return false;">' + (i + 1) + '<\/a> ';
        }
        pageLinks += '<\/div>';
        //display returned data and page links in chosen div (.showproduct)
        $('.showproduct').html(pageLinks + data);
        showProductPage(0);
    });
});
//function to slice up records into pages
function showProductPage(pageNo) {
    var perPage = 2;
    var start = pageNo * perPage;
    var end = start + perPage;
    $('.image').hide().filter(function (index) {
        return ((index > (start - 1)) && (index < end));
    }).show();
}

Answer 1

//check out this line of your code
    $('.showproduct').html(pageLinks + data);

data var还包含其中的所有记录。您必须使用基于pageSize * pageNum迭代的for循环获取每个数据[position]。所以第1页看起来像

var iterationSize = pageSize  * pageNum; //(2 * 1 = 2)
var i;
var j = 0;
var pageData[];
for(i = pageNum - 1; i < iterationSize; i++, j++){
    pageData[j] = data[i];
}

$('.showproduct').html(pageLinks + pageData.join(''));

用AJAX代码做的事情不对

1 个答案: