下一页/上一页的 AJAX 请求帮助 [英] AJAX Request Help for next/previous page
问题描述
如何使用 AJAX 获取下一页/上一页.
如何在浏览器中调用:
page.php?page=1-1
或
page.php?page=1
返回只是文本.
应该以这种格式加载页面:
1-1或者1
当用户单击下一页/上一页按钮时,我如何将该页码传递给 ajax 调用并显示结果.
另外,我如何跟踪用户当前正在查看的页面?以及如何为页面设置最大最小值,例如我有 100 页不要调用第 101 页
HTML
<input id="loadPages" name="loadPages" type="button" value="Previous"/><div id="displayResults" name="displayResults">
JS(这不起作用)
$("#loadPages").click(function(){$.ajax({网址:'page.php',数据:{'页面':'1-1'},错误:函数(){警报('错误');},成功:函数(返回数据){警报(返回数据);$('#displayResults').append(returnData);}});});
尝试这样的事情...保留一个名为 currentPage
的全局变量,并相应地调整页码.
现场演示 http://jsfiddle.net/Jaybles/MawSB/一个>
HTML
<input id="prev" type="button" value="Previous"/><div id="displayResults" name="displayResults">当前页面:1</div>
JS
var currentPage=1;加载当前页面();$("#next, #prev").click(function(){当前页面 =($(this).attr('id')=='next') ?currentPage + 1 : currentPage - 1;if (currentPage==0)//检查最小值当前页=1;else if (currentPage==101)//检查最大值当前页=100;别的加载当前页面();});函数 loadCurrentPage(){$('input').attr('disabled','disabled');//禁用按钮//显示加载图像$('#displayResults').html('<img src="http://blog-well.com/wp-content/uploads/2007/06/indicator-big-2.gif"/>');$.ajax({url: '/echo/html/',数据:'html=当前页面:'+ currentPage+'&delay=1',类型:'POST',成功:功能(数据){$('输入').attr('禁用','');//重新启用按钮$('#displayResults').html(data);//更新div}});}
那么你的php页面就可以访问$_REQUEST['page'];
并相应地返回数据.
How do I use AJAX to get the Next/Previous Page(s).
How to call in a browser:
page.php?page=1-1
or
page.php?page=1
The return is just text.
Should load pages in this format:
1-1 or 1
When the user clicks the next/previous page button(s) how do I pass that page number to the ajax call and display the results.
Also how do I keep track of what page the user is currently viewing? And how do I put a max min for pages, like I have 100 pages don't make call for page 101
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 (This is not working)
$("#loadPages").click(function(){
$.ajax({
url: 'page.php',
data:{'page': '1-1'},
error : function (){ alert('Error'); },
success: function (returnData) {
alert(returnData);
$('#displayResults').append(returnData);
}
});
});
Try something like this... Keep a global variable called currentPage
and simply adjust the page number accordingly.
LIVE DEMO http://jsfiddle.net/Jaybles/MawSB/
HTML
<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
}
});
}
Then your php page can access $_REQUEST['page'];
and return data accordingly.
这篇关于下一页/上一页的 AJAX 请求帮助的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!