Прикольная проблема создания страницы с jQueryMobile - PullRequest
Новая
       15

Прикольная проблема создания страницы с jQueryMobile

0 голосов
/ 21 марта 2012

Вот мой упрощенный код, который имеет две страницы, которые ссылаются друг на друга.В результате предупреждение о количестве страниц2 всегда говорит, что в DOM есть один # page2 div.Однако pagecreate срабатывает каждый раз, когда ссылается на page2.html.Первый раз - 1, второй - 2, и так далее ...

Может кто-нибудь объяснить, что происходит и как получить одно событие pagecreate для page2? 

index.html

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="jquery.mobile-1.0.1.min.css" />
    <script src="jquery-1.6.4.min.js"></script>
    <script src="jquery.mobile-1.0.1.min.js"></script>
</head>
<body>
    <div data-role="page">
        <div data-role="content">
            <h3>In Index Page</h3>
            <a href="page2.html" data-role="button">Go To Page2</a>
        </div>
     </div>
</body>
</html>


page2.html

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <div id="page2" data-role="page">
        <div data-role="content">
            <a href="index.html" data-role="button">Back</a>
        </div>
        <script type="text/javascript">
            alert("page2 count is " + $("#page2").length);
            $("#page2").live('pagecreate',function(event, ui) {
                alert("in page2 on pagecreate");
            });
        </script>
    </div>
</body>
</html>

Thanks,
-- Ed

1 Ответ

0 голосов
/ 21 марта 2012

jQM загружает последующие страницы в одну и ту же DOM (страницу) с помощью средств отладки / разработки с Chrome, и вы легко можете увидеть, как это происходит.

На последующих страницах он вытягивает что-либо между вашими тегами, но игнорирует все остальное, у вас может быть JS на ваших или других страницах, и он по-прежнему только вытягивает на странице 2.

Что именнос вами происходит то, что когда вы загружаете # page2 в первый раз, он правильно добавляет прямое событие в # page2, затем вы переходите к index.html, но # page2 остается в вашем DOM.Теперь, когда вы снова зайдете на # page2, он снова запустит ваш JS 

 $("#page2").live('pagecreate',function(event, ui) {
        alert("in page2 on pagecreate");
 });

Это снова свяжет ваше оповещение, и 2 события сработают, в следующий раз сработает 3.

То, как вы 'Предполагается, что он загружает все ваши JS в начале и слушает pageinit / pageshow, см. мой другой пост: https://stackoverflow.com/a/9085014/737023

Или, если у вас есть какие-либо вопросы, задавайте здесь

...