AJAX请求帮助下一/ previous页 [英] AJAX Request Help for next/previous page

问题描述

我如何使用AJAX来获取下一个/ previous页（S）。

如何在浏览器中调用：

  page.php？页= 1-1
 

或

  page.php？页= 1
 

返回仅仅是文本。

应该载入的页面格式为：

1-1 要么 1

当用户点击下一个/ previous页按钮（S）我怎么传递页码Ajax调用并显示结果。

另外我如何跟踪哪些页面的用户正在观看的？ 我如何把一个最高分的页面，比如我有100个页面不作要求101页

http://jsfiddle.net/2b8gR/5/

HTML

 ＆LT;输入ID =loadPagesNAME =loadPages类型=按钮值=下一步/＆GT;
＆LT;输入ID =loadPagesNAME =loadPages类型=按钮值=previous/＆GT;
＆LT; D​​IV ID =displayResultsNAME =displayResults＆GT;
＆LT; / DIV＆GT;
 

JS（这不工作）

  $（＃loadPages）。点击（函数（）{
    $阿贾克斯（{
        网址：page.php，
        数据：{页面：1-1​​}，
        错误：函数（）{警报（错误）; }，
        成功：函数（returnData）{
            警报（returnData）;
            $（'＃displayResults）追加（returnData）。
        }
    }）;
}）;
 

解决方案

尝试这样的事情...随身携带一本名为当前页全局变量，只是调整相应的页码

现场演示 http://jsfiddle.net/Jaybles/MawSB/

HTML

 ＆LT;输入ID =下一个类型=按钮值=下一步/＆GT;
＆LT;输入ID =preV类型=按钮值=previous/＆GT;
＆LT; D​​IV ID =displayResultsNAME =displayResults＆GT;当前页：1＆LT; / DIV＆GT;
 

JS

  VAR当前页= 1;
loadCurrentPage（）;

$（＃接下来，＃preV）。点击（函数（）{
    当前页=
        （$（本）.attr（'身份证'）=='下一步'）？当前是+ 1：当前页 -  1;

    如果（当前是== 0）//检查分钟
        当前是= 1;
    否则，如果（当前页== 101）//检查最大
        当前是= 100;
    其他
        loadCurrentPage（）;
}）;

功能loadCurrentPage（）{
    $（'输入'）ATTR（禁用，禁用）。 //禁用按钮

    //显示加载图像
    $（'＃displayResults）HTML（'＆LT; IMG SRC =http://blog-well.com/wp-content/uploads/2007/06/indicator-big-2.gif/＆GT;'） ;

    $阿贾克斯（{
        网址：/回声/ HTML /'，
        数据：'HTML =当前位置：'+当前页+'和;延迟= 1'，
        键入：POST，
        成功：功能（数据）{
            $（'输入'）ATTR（'残疾'，''）。 //重新启用按钮
            $（'＃displayResults'）的HTML（数据）; //更新事业部
        }
    }）;
}
 

那么你的PHP页面可以访问 $ _ REQUEST ['页']; 键，返回相应数据。

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

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 (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请求帮助下一/ previous页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！