0

I am trying to use jquery mobile panels for navigation menu in my app, this menu appears when you click on the menu button on pages, from the doc, I understand that I should add this menu panel to every page.

Since my pages are also added at run time, I need someway to inject the menu panel into the page when it is created, I'm using following code which is not working:

var $menuElement = $("#menu");
if ($activePage.find($menuElement).length <= 0) {
    console.log("Adding menu");
    $menuElement.show().css({height:$(".fb-menu").find("li").size() * 5 + "px"});
    $menuElement.prependTo($activePage);
    $activePage.trigger('create');
    $activePage.trigger('update');
}

anyone has an idea how should I add my menu panel to a page which is added dynamically?

4

1 回答 1

0

看看我关于这个解决方案的其他答案：https ://stackoverflow.com/a/15223926/1848600

这是您可以动态添加它的方式：

$(document).on('pagebeforeshow', '[data-role="page"]', function(){                
    $('<div>').attr({'id':'mypanel','data-role':'panel'}).appendTo($(this));
    $('<a>').attr({'id':'test-btn','data-role':'button'}).html('Click me').appendTo('mypanel');
    $.mobile.activePage.find('#mypanel').panel();
    $(document).on('click', '#open-panel', function(){   
         $.mobile.activePage.find('#mypanel').panel("open");       
    });    
});

现场示例：http: //jsfiddle.net/Gajotres/pZzrk/

于 2013-03-12T14:28:12.543 回答