Кнопка возврата jQuery не работает должным образом после обновления

В моем мобильном приложении jQuery;

В menu.html и внутри тела я делаю что-то подобное, чтобы перейти к help.html;

....

$(document).off('pageinit', '#menupage').on('pageinit', '#menupage', function() {

    $(document).off('click', '#help').on('click', '#help', function(){
            $.mobile.changePage("help.html", {
                reloadPage: true,
                transition: "flip",
                reverse: false
            });
        });
}

....

<li><a id="help" href="#" role="link" data-role="none">
                        <div class="img help"></div>
                        <div class="menuTitle langMenuItem3">Help</div>
                        <div class="arrow"></div>
</a></li>

Затем на странице help.html у меня есть кнопка «Назад», чтобы вернуться к menu.html:

<header data-role="header">
    <a href="#" data-rel="back" class="button" data-role="none">
        <div class="arrow_reverse"></div><span class="langBack">Terug</span>
    </a>
    <div class="pageTitle">Over deze app</div>
</header>

Моя проблема в том, что это работает в нормальных условиях, НО если я сделаю обновление в menu.html, затем перейду к help.html и затем снова вернуться в меню, menu.html не загружается должным образом, я вижу, что страница визуально загружается нормально, но в firebug я вижу, что некоторые необходимые javascripts внутри тегов больше не работают, он больше никогда не попадает ни в какие javascripts где-либо в menu.html, просто загружает предыдущий html из кеша, вот и все. Кроме того, заголовок страницы menu.html не меняется правильно и после этого остается как «Справка».

мой полный menu.html выглядит так;

http://jsfiddle.net/M5CYZ/

Есть идеи?


javascript jquery jquery-mobile jquery-mobile-button
person Spring    schedule 05.04.2013    source источник
comment
если вы несколько раз назад и далее без обновления, вы столкнетесь с тем же?   -  person Omar    schedule 05.04.2013
comment
@ Омар, да .. но если я обновлю help.html, проблема исчезнет!   -  person Spring    schedule 05.04.2013
comment
Это странно... тогда проблема в menu.html. Можете ли вы опубликовать его разметку? используете data-dom-cache или data-prefetch?   -  person Omar    schedule 05.04.2013
comment
@ Омар извините, что это такое? :)   -  person Spring    schedule 05.04.2013
comment
лол, вещи, которые иногда вызывают головную боль ;) не могли бы вы опубликовать разметку и код menu.html? или скрипка. дом-кэш и предварительная выборка.   -  person Omar    schedule 05.04.2013
comment
@Omar tnx Я копирую сюда код из menu.html jsfiddle.net/M5CYZ   -  person Spring    schedule 05.04.2013
comment
давайте продолжим это обсуждение в чате   -  person Omar    schedule 05.04.2013

Ответы (2)


arrow_upward
2
arrow_downward

Делай так.

Кнопка возврата ID

<a href="#" id="backbtn" class="button"> 
 <div class="arrow_reverse"></div><span class="langBack">Terug</span> 
</a>

а затем добавьте приведенный ниже код в help.html.

$('#backbutton').off('click').on('click', function () { 
 $.mobile.changePage("menu.html", { 
  reloadPage: true, 
  transition: "flip", 
  reverse: true 
 }); 
});
person Omar    schedule 05.04.2013
comment
Похоже, вам не хватает точки (.) для on(). - person Sparky; 07.06.2013

arrow_upward
2
arrow_downward

Это дикое предположение, но согласно вашему коду это нормальное поведение.

Событие jQuery Moible pageinit будет запускаться только один раз во время начальной загрузки страницы, и если страница не будет обновлена ​​(вручную, с rel="external" или в вашем случае reloadPage="true"), оно больше никогда не будет запускаться.

Если вы хотите, чтобы javascript выполнялся снова при каждом посещении страницы, используйте вместо этого событие pagebeforeshow. Как видно из вашего примера, удаление страницы и добавление ее обратно вам не поможет.

Если вы хотите узнать больше, прочитайте мой другой ответ/статью о событиях страницы: jQuery Mobile: готовность документа и события страницы

И вот пример, подтверждающий мою точку зрения: http://jsfiddle.net/Gajotres/Q3Usv/

$(document).on('pageinit', '#index', function(){       
    alert('Pageinit');
});

$(document).on('pagebeforeshow', '#index', function(){       
    alert('Pagebeforeshow');
});
person Gajotres    schedule 05.04.2013
comment
Другое дело, если я обновлю файл help.html и вернусь назад, тогда проблема решит .. есть идеи? - person Spring; 05.04.2013
comment
как я уже сказал, мой код работает хорошо, но когда я вручную обновляю меню.html, возникает эта проблема - person Spring; 05.04.2013
comment
Интересно. Можете ли вы попробовать что-то еще. Замените ваш help.html на этот код кнопки: Теруг‹/span› ‹/a› - person Gajotres; 05.04.2013