pagebeforehide事件仅针对“内部”页面转换而触发

Question

离开页面时我需要做点什么（页面'#first'）。 这很简单：

$(document).on('pagebeforehide', '#first', function(event, ui) {alert('leaving page');});

当我通过“内部”链接离开页面时没问题：

<a href="#second" data-role="button">Open something</a>

此处事件已触发且处理程序已执行。

但是当我想打开像这样的外部链接时：

<a href="http://www.google.com" rel="external" data-role="button">Open something</a>

此处事件未被触发且处理程序未执行。

页面内容简单或复杂无关紧要 - 我发现这只取决于链接内部或外部的事实。

怎么了？

Answer 1

rel =“external”表示该页面将作为外部页面打开，所有以前的页面内容（包括其脚本）都将丢失，这也会触发整页刷新，因此您的 pagebeforehide 事件不会触发因为它将不再存在。

jQuery Mobile页面事件只能在正常页面更改期间发生。基本上我想说的是你需要转到其他jQuery Mobile页面才能触发此事件。在您的情况下，您强制应用程序执行整页刷新，此时，页面刷新将在 pagebeforehide 事件之前进行。

编辑：

虽然没有任何crossbrowser解决方案，但你总是可以作弊。

1. 不要在按钮内部使用href链接，而是将链接http://www.google.com替换为＃并添加一个ID，以便我们识别它，如下所示：

   打开一些东西

现在向此按钮添加点击事件，并在将页面更改为www.google.com之前执行以下操作：

    $(document).on('click', '#change-page', function(){       
        // Do something here then change page
    });

1. 或者将您的按钮链接到另一个虚拟内页（仅为此目的使用此内页），抓住pagebeforehide：

   $(document).on('pagebeforehide ', function(){       
       // Again do something here and manualy change the page
   });