Вопрос по mobile, jquery – Один и тот же нижний колонтитул Jquery Mobile на разных страницах

5

Я хочу иметь одинаковые верхний и нижний колонтитулы на всех страницах моего мобильного приложения jquery и управлять им, используя другой файл, например, footer.html. Это легко сделать, используя PHP include, но я не могу, потому что я планирую использовать это приложение с phonegap.

Поиск вокруг я нашел с помощью

  <div data-role="footer">
<div class="footerExt"></div>
  </div>

и JavaScript

$('.footerExt').load('footer.html')

Однако это не работает. Я должен отметить, что я новичок в JavaScript, я едва понимаю, что происходит.

большое спасибо

Ваш Ответ

3   ответа
0

Вам необходимо загрузить внешний HTML-код в div с data-role = & quot; footer & quot ;, поэтому вам нужно изменить:

<div class="footerExt"></div>

to

<div data-role="footer" class="footerExt"></div>

и, например, HTML-код вашего нижнего колонтитула может иметь h3

  <h3>This is your footer</h3>
Мой код теперь выглядит следующим образом: & lt; div data-role = & quot; footer & quot; & gt; & lt; div data-role = "footer" класс = & Quot; footerExt & Quot; & GT; & Lt; / дел & GT; & Lt; / DIV & GT; & APOS; Но, к сожалению, его все еще не работает. Не совсем уверен, что я делаю не так. Спасибо P22
8

Попробуйте со следующим событием, это работает с моим кодом:

$('[data-role=page]').live('pageshow', function (event, ui) {
            $("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){
                $("#" + event.target.id).find("[data-role=navbar]").navbar();
            });
        });

этосуть показывает весь код

Это работало хорошо, но есть идеи, как заставить это работать с ui-btn-active? Или это даже возможно, потому что, если я добавлю класс к кнопкам, все кнопки будут отображаться как активные на главной странице. P22
в идеале вы должны применить тему, чтобы отличить одну кнопку от другойjquerymobile.com/demos/1.1.0/docs/buttons/buttons-themes.html
Спасибо большое работает отлично! Просто то, что я снова искал, спасибо. :) P22
Лучшее решение:stackoverflow.com/questions/7974630/…
1

из JQuery 1,9 и вышежить сейчас устарела пожалуйста, используйте функцию с вкл. В консоли это даст TypeError: $ (...). Live это не функция

пример измени свой код

$('[data-role=page]').live('pageshow', function (event, ui) {
            $("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){
                $("#" + event.target.id).find("[data-role=navbar]").navbar();
            });
        });

Replace with

 $('[data-role=page]').on('pageshow', function (event, ui) {
                $("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){
                    $("#" + event.target.id).find("[data-role=navbar]").navbar();
                });
            });

Похожие вопросы