Jquery Mobile 1.4 перейти к динамически создаваемой странице

Question

Jquery Mobile 1.4 перейти к динамически создаваемой странице

0

Это вызывает раздражение меня в течение некоторого времени, поэтому, пожалуйста, помогите, если сможете.

Поэтому я начинаю с пустой страницы:

<!DOCTYPE html>
<html>
<head>
    <title>Page Title</title>

    <meta name='viewport' content='width=device-width, initial-scale=1'>

<link rel='stylesheet' href='http://code.jquery.com/mobile/1.4.0-rc.1/jquery.mobile-1.4.0-rc.1.min.css'>
<script src='http://code.jquery.com/jquery-1.10.2.min.js'></script>
<script src='http://code.jquery.com/mobile/1.4.0-rc.1/jquery.mobile-1.4.0-rc.1.min.js'></script>
</head>
<body>

</body>
</html>

</body>
</html>

Затем введем jqm-страницу в html:

$('body').append("<div id='index' data-role='page'><div data-role='header'><h1>Page Title</h1></div><!-- /header --><div data-role='content'><ul data-role='listview'><li>test</li><li>test</li><li>test</li></ul><p>Page content goes here.</p></div><!-- /content --><div data-role='footer'><h4>Page Footer</h4></div><!-- /footer --></div><!-- /page -->")

Наконец, я бы восстановил/обновил разметку этой страницы:

$("body").enhanceWithin()

Вопрос в том, как я могу перейти на эту страницу программно, потому что, похоже, не работают ни $.mobile.navigate('# index'), ни $.mobile.changePage('# index')?

 $(":mobile-pagecontainer").pagecontainer("getActivePage")

возвращается

Object [DIV # index.ui-страница]

 $(':mobile-pagecontainer').pagecontainer('change', '#index')

возвращается

Объект [body.ui-мобильно-видовой экран]

однако индексная страница по-прежнему остается скрытой от просмотра.....

Как вы видите, используя jquery.mobile-1.4.0-rc.1, пожалуйста, помогите!

zzart 12 нояб. 2013, в 13:11

Источник

Теги:

html

navigation

jquery-mobile

markup

1 ответ

Ещё вопросы

Gajotres · Accepted Answer · 2013-11-12T10-23-00.000Z

Решение

Так вы делаете это с помощью jQuery Mobile: http://jsfiddle.net/Gajotres/3eHGj/

Javascript:

$(document).ready(function() {    
    $('body').append("<div id='index' data-role='page'><div data-role='header'><h1>Page Title</h1></div><!-- /header --><div data-role='content'><ul data-role='listview'><li>test</li><li>test</li><li>test</li></ul><br><p>Page content goes here.</p></div><!-- /content --><div data-role='footer'><h4>Page Footer</h4></div><!-- /footer --></div><!-- /page -->")
    window.location.hash = 'index';
    $.mobile.initializePage();
});

HTML:

<!DOCTYPE html>
<html>
    <head>
        <title>jQM Complex Demo</title>
        <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script>
            $(document).on("mobileinit",function() {
                $.mobile.autoInitializePage = false;
            });        
        </script>
        <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>    
    </head>
    <body>

    </body>
</html>

объяснение

Без начальной страницы не будет работать ни $.mobile.navigate('#index') ни $.mobile.changePage('#index'). Эти методы требуют, чтобы оригинальная страница существовала до того, как приложение может перейти на другую страницу.

Вызов «$ .mobile.initializePage ()» пройдет по всем текущим страницам и выполнит инициализацию на всех из них. Можно ли инициализировать только что добавленную страницу?