AJAX请求下一页/上一页的帮助

如何使用AJAX获取下一页/上一页

如何在浏览器中调用：

page.php?page=1-1

或

返回的只是文本

应以以下格式加载页面：

1-1 或 一,

当用户单击下一页/上一页按钮时，我如何将该页码传递给ajax调用并显示结果

另外，我如何跟踪用户当前正在查看的页面？ 我该如何设置页面的最大最小值，就像我有100个页面一样，不要调用第101页

HTML

---

试试这样的。。。保留一个名为

currentPage

的全局变量，只需相应地调整页码即可

现场演示

HTML

<input id="next" type="button" value="Next" />
<input id="prev" type="button" value="Previous" /> 
<div id="displayResults" name="displayResults">Current Page: 1</div>

当前页：1

JS

var currentPage=1;
loadCurrentPage();

$("#next, #prev").click(function(){
    currentPage = 
        ($(this).attr('id')=='next') ? currentPage + 1 : currentPage - 1;

    if (currentPage==0) //Check for min
        currentPage=1;
    else if (currentPage==101) //Check for max
        currentPage=100;
    else
        loadCurrentPage();
});

function loadCurrentPage(){
    $('input').attr('disabled','disabled'); //disable buttons

    //show loading image
    $('#displayResults').html('<img src="http://blog-well.com/wp-content/uploads/2007/06/indicator-big-2.gif" />'); 

    $.ajax({
        url: '/echo/html/',
        data: 'html=Current Page: ' + currentPage+'&delay=1',
        type: 'POST',
        success: function (data) {
            $('input').attr('disabled',''); //re-enable buttons
            $('#displayResults').html(data); //Update Div
        }
    });
}

var currentPage=1；
loadCurrentPage（）；
$（“#下一步，#上一步”）。单击（函数（）{
当前页面=
（$（this.attr（'id'）='next'）？currentPage+1:currentPage-1；
if（currentPage==0）//检查最小值
currentPage=1；
else if（currentPage==101）//检查最大值
当前页面=100；
其他的
loadCurrentPage（）；
});
函数loadCurrentPage（）{
$（'input'）.attr（'disabled'，'disabled'）；//禁用按钮
//显示加载图像
$（'#displayResults'）.html（''）；
$.ajax({
url:“/echo/html/”，
数据：'html=当前页面：'+currentPage+'&delay=1'，
键入：“POST”，
成功：功能（数据）{
$（'input'）.attr（'disabled'，''）；//重新启用按钮
$（'#displayResults'）.html（数据）；//更新Div
}
});
}

---

然后您的php页面可以访问

$\u请求['page']并相应地返回数据。
您的javascript有以下错误：
错误：第11行出现问题字符1:预期'，而不是看到'。}第11行字符1出现问题：缺少分号。}Sry这是否修复了错误？Firebug现在不在Chrome中为我工作，唉……我相信你的数据字段也很混乱。请尝试
data:'page=1-1'
或
data:{'page'：'1-1'}
这与我需要的非常接近，似乎与JQM jQuery Mobile不兼容。在查看请求时，我没有看到页面参数被追加到请求中尝试删除数据字段并将url读取为
url:'page.php？page='+currentPage，
yeah尝试过，仍然没有返回任何内容，但我看到请求url指向的页面
page.php？page=1
如果您手动导航到该页面，该页面是否正常工作？它几乎正常工作，只是添加了数据，而不是替换了数据
$("#loadPages").click(function(){
    $.ajax({
        url: 'page.php',
        data:{'page': '1-1'},
        error : function (){ alert('Error'); }, 
        success: function (returnData) {
            alert(returnData);
            $('#displayResults').append(returnData);
        }
    });
});

<input id="next" type="button" value="Next" />
<input id="prev" type="button" value="Previous" /> 
<div id="displayResults" name="displayResults">Current Page: 1</div>

var currentPage=1;
loadCurrentPage();

$("#next, #prev").click(function(){
    currentPage = 
        ($(this).attr('id')=='next') ? currentPage + 1 : currentPage - 1;

    if (currentPage==0) //Check for min
        currentPage=1;
    else if (currentPage==101) //Check for max
        currentPage=100;
    else
        loadCurrentPage();
});

function loadCurrentPage(){
    $('input').attr('disabled','disabled'); //disable buttons

    //show loading image
    $('#displayResults').html('<img src="http://blog-well.com/wp-content/uploads/2007/06/indicator-big-2.gif" />'); 

    $.ajax({
        url: '/echo/html/',
        data: 'html=Current Page: ' + currentPage+'&delay=1',
        type: 'POST',
        success: function (data) {
            $('input').attr('disabled',''); //re-enable buttons
            $('#displayResults').html(data); //Update Div
        }
    });
}