如何使用jQuery Mobile阻止链接添加到历史堆栈中

Question

使用jQuery mobile,我使用列表视图,其中包含前一个和下一个链接以进行分页.一切正常,但我不希望将prev和next页面添加到历史堆栈中.这个想法是回击将只到实际的前一页.

我发现这样做的唯一方法是将data-rel ="dialog"添加到a标签中,但我不希望它成为弹出式对话框.

否则我试着添加

$.mobile.nonHistorySelectors="dialog,pagination"

到mobileinit事件,将属性data-rel ="pagination"添加到a标签.但是这只会在单击链接时抛出错误(即使没有将nonHistorySelectors添加到mobileinit事件,也会发生错误).

编辑:

我发现的最接近的是这个JS

<script type="text/javascript">
    $(".page-prev").click(function(e) {
        e.stopPropagation();
        e.preventDefault();

        $.mobile.changePage(this.href, {changeHash:false, reverse:true});
    });

    $(".page-next").click(function(e) {
        e.stopPropagation();
        e.preventDefault();

        $.mobile.changePage(this.href, {changeHash:false});
    });
</script>

和这个HTML

<a href="/blog?page=1" class="page-prev" data-role="button" data-icon="arrow-l">Prev</a>
<a href="/blog?page=3" class="page-next" data-role="button" data-icon="arrow-r">Next</a>

这似乎很好地保持浏览器历史记录不被更新,但有时当点击下一页时,滑动的页面会做一些时髦的事情,例如加载/滑动两次.此外,它没有做到的一件事是,如果我从这里导航到一个页面并返回,它将返回到第1页.

Answer 1

这样做应该没问题：

 // Fix for back buttons
    $(document).on('vclick', '[data-rel=back]', function(e) {
        e.stopImmediatePropagation();
        e.preventDefault();
        // $.mobile.back(e);
        var back = $.mobile.activePage.prev('[data-role=page]');
        $.mobile.changePage(back, {
            transition: 'slide',
            reverse: true,
            changeHash: false
        });
    });