Как восстановить URL страницы в Jquery Mobile? - PullRequest
Новая
       21

Как восстановить URL страницы в Jquery Mobile?

1 голос
/ 20 марта 2012

Я использую вложенные страницы в Jquery Mobile:

Выглядит так: 

// wrap page
<div data-role="page" id="wrap">
     // panel
     <div data-role="panel" data-id="popover">
         // nested pages
         <div data-role="page" id="nested1"></div>
         <div data-role="page" id="nested2"></div>
     </div>
</div>

На переходах я переключаю $. Mobile.pageContainers загружать вложенные страницы в панели или загружать их в тело (по умолчанию JQM) следующим образом: 

$.mobile.changePage( page-to-be-loaded, {
          // previous page in panel
          fromPage:from,         
          // update the URL with the nested page hash    
          changeHash:hashChange,     
          // target panel
          pageContainer: $('div:jqmData(id="popover")')
          });

Все это работает как положено = когда я загружаю вложенную страницу внутри панели, URL-адрес обновляется до 

http://some.com#nested1/2/3...

Моя проблема заключается в «очистке» URL-адреса, когда я покидаю страницу переноса и вообще перехожу на новую страницу JQM

В этом случаеURL застрял на последней вложенной странице, когда мне нужно сообщить JQM, что я на самом деле все еще на странице переноса (независимо от того, какая вложенная страница все еще находится в URL).

Вопрос: Поэтому я ищу способ обновить URL-адрес до его правильного значения или хороший способ установки параметров страницы на «заводские настройки», чтобы JQM никогда не знал, что я делал какие-либо переходы панели на своей вложенной странице.

Я пытался: 

// 1. location hash - doesn't work

   window.location.hash = ""


// 2. ReplaceState - breaks on non-push-state browsers

   // on pageinit store defaults
   var $myState = {};   
   $myState.title = document.title;
   $myState.url = location.protocol + '//' + location.host + location.pathname;

  page.data("rememberState", $myState )

  // before leaving the wrap page
  var rem = $('#wrap.ui-page-active').data("rememberState");
  if (rem && typeof rem != 'undefined') {   
     history.replaceState('null',rem.title,rem.url);
     }

// 3. Reload the page when hiding the panel - crashes my browser :-)

   $.mobile.changePage('#wrap', {
                  allowSamePageTransition: true, 
                  changeHash:true,
                  transition:none 
                  });

Так как я далеко от пути JQM, я просто ищунамеки.Спасибо за любой указатель!

Ответы [ 2 ]

0 голосов
/ 20 марта 2012

Решено так:

Когда пользователь впервые заходит на сайт, я собираю количество записей в истории: 

$windowHistoryAtInit = window.history.length

Скажем, в истории 27 записейЯ хотел бы, чтобы новая запись создавалась только тогда, когда пользователь покидает страницу A и переходит на страницу B, поэтому все вложенные переходы внутри страницы A не должны учитываться в общей сумме window.history.

Когда пользователь покидает страницу, я перепроверяю.

$(document).on('pagebeforehide', '#pageA', function(e, data) {
   // get number of history entries based on nested transitions
   var distance = window.history.length-self.options.$windowHistoryAtInit
   // go back distance
   window.history.go(-distance);     
   });

В моей настройке возврат расстояния не вызывает фактические JQM-переходы, поэтому я просто возвращаю браузер туда, где он был запущен, когда пользователь зашел на сайт, а затем продолжаю переходить изPageA к PageB.

Мне, вероятно, придется настроить это, вычтя -50 из счетчика, потому что я думаю, что он не превышает 50 записей.Таким образом, при входе с window.history.length 50, счетчик начинает «свежий» с 0.

0 голосов
/ 20 марта 2012

Это скорее ответ подхода, а не показ кода, но сначала делать это глупо, а потом учиться на нем.

Проблема в том, что вы делаете это не так, как предписано платформой. Вы не должны использовать платформу, если вы делаете это так, как это. Вы должны взять свои вложенные страницы и удалить их. Это плохая идея. Он не был запрограммирован на такое поведение. Просто создайте 3 страницы, живущие в одном файле. Затем прочитайте документы о том, как использовать многостраничное приложение. Я сделал несколько мобильных приложений и выбрал плохие идеи с помощью jQuery Mobile. Если вы просто идете с фреймворком и знаете его ограничения, все гладко.

Как вы собираетесь обновить этот продукт после обновления jQuery Mobile? Вы будете создавать странные причуды, уходящие с пути. Это просто не очень хорошая идея.

...