Сохранение запросов мобильных заголовков одинаковых

Question

Я пишу небольшое приложение, имеющее один заголовок на нескольких страницах, поэтому вместо того, чтобы писать один и тот же бит кода снова и снова, я хотел включить переменную, похожую на 'include (' header.php ')' в php.

Я в настоящее время сделано:

//Set header for each page 
    var fund_header = '<div data-role="header" data-theme="z" data-position="inline"><a href="javascript:void(0)" onclick="javascript: reset(); $.mobile.changePage("#fund_1");" data-icon="delete" class="restart">Restart</a><h1>Funding</h1><a href="index.html" data-icon="home" class="ui-btn-right" data-iconpos="notext" rel="external" data-ajax="false">Home</a></div>'; 

Затем на страницах добавлено:

<div data-role="page" id="fund_2" data-theme="z"> 
    <script type="text/javascript">document.write(fund_header);</script> 

Это самая лучшая практика? Или есть лучший способ?

Answer 1

Вместо хранения заголовка в переменной вы можете захотеть создать отдельный файл html заголовка и загрузить его с помощью Ajax.

Я не пробовал это сам, но, глядя на API jQuery Mobile, похоже, вы могли бы использовать $.mobile.loadPage для этого, вместо того, чтобы сами писать запрос ajax.

Запрос, вероятно, выглядеть так: $.mobile.loadPage('header.html', { pageContainer: $('header') });

См: http://code.jquery.com/mobile/latest/demos/docs/api/methods.html

Если это не работает, вы можете также использовать JQuery-х .ajax (http://api.jquery.com/jQuery .ajax /).

Хотелось бы услышать, есть ли лучшее решение, предоставляемое JQM.