jQuery для мобильной загрузки динамических страниц - PullRequest
Новая
       12

jQuery для мобильной загрузки динамических страниц

1 голос
/ 15 ноября 2011

У меня есть страница index.html, которая загружает мобильные библиотеки jquery и jquery (последние версии) со ссылками на две другие страницы.

<a href="page2.html" class="ui-state-persist" id='some_id' data-role="button" data-theme="e"  >Page2</a>

<a href="page3.html" class="ui-state-persist" id='some_id' data-role="button" data-theme="e"  >Page3</a>

Можно ли включить пользовательские файлы javascript на страницы 2 и 3?Если я включу их как этот, page2.html рендерится правильно, но файл js, похоже, будет проигнорирован.Цель этого состоит в том, чтобы распределить время ожидания при загрузке javascript между главным меню и страницами приложения.

page2.html: 

<!DOCTYPE html>
<html>
    <head>
    <title>My Apptitle>
    <meta charset="utf-8"/>

    <!-- custom files and libraries --> 
    <script src="../js/mycode.js"></script> 
    </head>
    <body>

<div data-role="page"  id="preTktTab">
<div data-role="header" data-position="inline">
<!-- and so on -->

1 Ответ

0 голосов
/ 15 ноября 2011

Вот объяснение, которое я дал кому-то по очень похожему вопросу: События страницы jQueryMobile не запускаются при переходе на другую HTML-страницу

В основном, когда вы переходите на страницу в платформе jQuery Mobile, она перетаскивает страницу в DOM через AJAX. При этом он захватывает только HTML-код в первом элементе <div data-role="page"> на странице и игнорирует остальную часть страницы. Поэтому, если вы хотите загрузить JavaScript для этих просмотров страниц, вам нужно добавить теги <script> внутри элемента <div data-role="page">.

Например, изменить: 

<html>
<head>
    <script src="..." type="text/javascript"></script>
</head>
<body>
    <div data-role="page">
        ...mobile page here...
    </div>
</body>
</html>

Кому: 

<html>
<head>
</head>
<body>
    <div data-role="page">
        <script src="..." type="text/javascript"></script>
        ...mobile page here...
    </div>
</body>
</html>

Вот хорошее прочтение на эту тему (обратите внимание на «Известные ограничения» внизу страницы): http://jquerymobile.com/demos/1.0rc3/docs/pages/page-navmodel.html

...