如何使用AJAX获取下一页/上一页。
如何在浏览器中调用:
page.php?page=1-1
要么
page.php?page=1
返回的只是文本。
应该以这种格式加载页面:
1-1或1
当用户单击下一页/上一页按钮时,如何将该页码传递给ajax调用并显示结果。
另外,我该如何跟踪用户当前正在浏览的页面?以及我该如何为页面设置最大最小值,例如我有100个页面却没有拨打101页面
http://jsfiddle.net/2b8gR/5/
的HTML
<input id="loadPages" name="loadPages" type="button" value="Next" /> <input id="loadPages" name="loadPages" type="button" value="Previous" /> <div id="displayResults" name="displayResults"> </div>
JS(这不起作用)
$("#loadPages").click(function(){ $.ajax({ url: 'page.php', data:{'page': '1-1'}, error : function (){ alert('Error'); }, success: function (returnData) { alert(returnData); $('#displayResults').append(returnData); } }); });
尝试这样的事情…保持一个名为的全局变量,currentPage然后简单地相应地调整页码。
currentPage
现场演示 http://jsfiddle.net/Jaybles/MawSB/
<input id="next" type="button" value="Next" /> <input id="prev" type="button" value="Previous" /> <div id="displayResults" name="displayResults">Current Page: 1</div>
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 } }); }
然后,您的php页面可以相应地访问$_REQUEST['page'];和返回数据。
$_REQUEST['page'];