jquerymobile 下一页按钮答案

【问题标题】：jquerymobile next page buttonjquerymobile 下一页按钮
【发布时间】：2011-06-04 06:39:04
【问题描述】：

我正在尝试在标题中创建一个按钮以显示下一页。

<a href="#test" data-theme="b" data-rel="next" data-role="button">Next</a>

有一个具有 id#test 的 data-role=page div，但是当我点击下一个 btn 时，它会在 url 中显示类似这样的内容

/index.html#home&ui-state=dialog

并没有打开页面，尽管我可以通过在浏览器 url 栏最后手动输入 #test 来打开该页面。

【问题讨论】：

标签： javascript jquery-mobile

【解决方案1】：

这应该对你有帮助：AJAX Request Help for next/previous page

实时示例：http://jsfiddle.net/Jaybles/MawSB/

var currentPage=1; 加载当前页面（）；

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

    if (currentPage==0) 
        currentPage=1;
    else if (currentPage==101) 
        currentPage=100;
    else
        loadCurrentPage();
});

function 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/',
        data: 'html=Current Page: ' + currentPage+'&delay=1',
        type: 'POST',
        success: function (data) {
            $('input').attr('disabled','');
            $('#displayResults').html(data);
        }
    });
}

HTML

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

【讨论】：