jQuery Mobile后退按钮 [英] Jquery Mobile Back Buttons

问题描述

我有一个应用程序，其中我以编程方式向页面添加了后退按钮.这意味着首页上没有后退按钮.但是，应用程序本身可以通过多种方式进入应用程序，换句话说，我可以获得通知，并在触摸该通知时将其转到应用程序中的特定区域.此区域将没有后退按钮可转到主页，如果我手动添加一个后退按钮，则会与编程的后退按钮发生冲突.

I have an application in which I am programmatically add a back button to the page. This means that the first page will not have a back button on it. However the app itself has many ways of entering the app, in other words I can get a notification and in touching that notification it goes to a particular area in the app. This area will not have a backbutton to go to the homepage, and if I add one manually it will conflict with the programmed back button.

因此，我正在寻找一种添加按钮的方法，该方法仅在页面首次加载时才返回首页，而在您访问该页面时，返回按钮则按预期执行.

So I am looking for a way to add a button to go back to the homepage only when the page is loaded first and other times when you visit the page the back button performs as expected.

推荐答案

我假设您使用的是data-add-back-btn=true在页面上动态添加data-rel=back按钮.因此，可以首先检查活动页面中是否没有data-rel=back，然后检查不是您的主页页面.

I assume that you're using data-add-back-btn=true to dynamically add data-rel=back buttons to your pages. Hence, it is possible by first, checking if there is no data-rel=back in the active page and secondly, it is not your Home page.

还有一件事，离​​开该页面后，您需要删除该按钮，以免与JQM将生成的按钮重叠.

One more thing, you need to remove that button once you navigate away from that page in order not to overlap with the one that JQM will generate.

演示

Demo

var backbtn = '<a href="#home" data-icon="arrow-l" data-iconpos="notext" class="backbtn"></a>';

$(document).on('pagebeforeshow', function () {
 var activePage = $.mobile.activePage;
 if (activePage.find('[data-rel=back]').length === 0 && activePage[0].id != 'home') {
  activePage.find('[data-role=header] h1').before(backbtn);
 }
 $('[data-role=page]').trigger('pagecreate');
 $(document).on('pagebeforehide', function () {
  $('a.backbtn').remove();
 });
});

这篇关于jQuery Mobile后退按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！