Używam jQuery mobile i obecnie buduję menu w locie, korzystając z poniższego kodu. Teraz muszę utworzyć rzeczywiste strony dla pozycji menu jako mój następny krok. Patrzyłem na jQuery Mobile iDynamiczne generowanie strony i myślę, że jest to coś, co „mógłbym” wykorzystać do osiągnięcia tego celu. Przeczytałem dokumenty Dynamic Page Generation i nie rozumiem, w jaki sposób mogę dopasować je do mojego obecnego kodu, a nawet, czy jest to właściwe dla tego, co muszę osiągnąć.

Widzę poniżej, że mam identyfikator i nazwę strony itd., Kiedy buduję wyjście menu dla strony głównej, czy ktoś może mi pokazać, jak teraz dynamicznie buduję potrzebne strony HTML przy użyciu jquery dla tych elementów menu? Dziękuję Ci.

$.each(siteData["pages"], function(i,v) {
             $.mobile.activePage.find('[data-role=content]').append('' +
                     '<a href='+ v["id"] + ' data-role="button">' + v["name"] + '</a>').trigger('create');

            // NOW I HAVE THE MENU LETS CREATE THE ACTUAL PAGES INSIDE HERE TOO
         });

Bieżące elementy menu znaczników utworzone wewnątrz listy nawigacyjnej:

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
    </div>

    <div data-role="content" class="navlist">
    </div>

    <div data-role="footer">
    </div><!-- /footer -->
</div>

Więc teraz dla każdego elementu potrzebuję wygenerować znaczniki dla każdego elementu za pomocą jquery.

AKTUALIZACJA: więc na podstawie sugestii spróbowałem czegoś takiego, ale to nie działa.

 $.each(siteData["pages"], function(i,v) {
     $.mobile.activePage.find('[data-role=content]').append('' +
             '<a href='+ v["id"] + ' data-role="button">' + v["name"] + '</a>').trigger('create');



     // Prepare your page structure
     var newPage = $("<div data-role='page' id=v[id]><div data-role=header>" +
             "<a data-iconpos='left' data-icon='back' href='#' data-role='button' " +
             "data-rel='back'>Back</a><h1>Dynamic Page</h1></div><div data-role=content>Stuff here</div></div>");

    // Append the new page info pageContainer
                 newPage.appendTo($.mobile.pageContainer);

    // Move to this page by ID '#page'
                 $.mobile.changePage('#'+v["id"]);


 });