Вставка динамической панели jquery mobile
В моем приложении я хотел бы повторно использовать панель, поэтому я вызываю эту функцию при открытии index.html:
var add_panel=function() {
//add button
$('[data-role="header"]').append('<a href="#leftpanel" class="ui-btn ui-icon-bars ui-btn-icon-notext ui-corner-all ui-btn-left">Menu</a>');
//panel
$.get('panel.html').success(function(data) {
$('div[data-role="page"]').append(data);
$('#leftpanel').trigger('create');
$('#leftpanel').panel();
});
//open panel
$('body').on('click', '.ui-icon-bars', function() {
$("#leftpanel").panel("toggle");
});
}
Это прекрасно работает на первой странице и при возврате на эту страницу с другой страницы.
Я надеялся вызвать ту же функцию внутри "pagecontainertransition", чтобы добавить панель и на другие страницы, но, похоже, это не сработало:
//handle page transitions
$('body').on('pagecontainertransition', function(event, ui) {
add_panel();
});
Можно ли это сделать?