jquery mobile - JS не выполняется на второй странице приложения с несколькими HTML

У меня есть приложение с несколькими HTML, построенное с помощью jQuery mobile и Phonegap/Cordova. Я понимаю, что одностраничный HTML предпочтительнее, но он просто не будет работать с моей текущей настройкой (я должен использовать CMS для создания контента, который будет находиться на отдельном HTML).jquery mobile - JS не выполняется на второй странице приложения с несколькими HTML

Все работает отлично на index.html. Я могу перемещаться из index.html в child.html с помощью обычного <a href="child.html"></a>, и страница загружается, и все выглядит хорошо (загружен CSS), но ни один из моих javascript не выполняется в child.html. Вкладки, выпадающие меню и т. Д., Использующие jQuery mobile API, больше не работают.

Это - структура моего файла index.html, который содержит вызовы в JS и CSS-файл.

<!DOCTYPE html> 
<html> 
    <script type="text/javascript" src="jquery.min.js"></script> 
    <script type="text/javascript" src="jquery.mobile-1.4.3.min.js"></script> 
    <script type="text/javascript" src="scripts.js"></script> 
    <script src="cordova.js"></script> 
    <link rel="stylesheet" href="styles.css" type="text/css"> 
<body> 
<div data-role="page"> 
    <div data-role="panel" id="mypanel" data-position="left" data-display="push">[nav code here]</div> 
    <div data-role="header">[header code here]</div> 
    <div data-role="main"> 
     [main content code here] 
     <a href="child.html">link to child page</a> 
    </div> 
    <div data-role="footer">[footer code here]</div> 
</div> 
</body> 
</html>

то, что внутри моего child.html страницы, которая получает связанную с индексной страницы

<div data-role="page"> 
    <div data-role="panel" id="mypanel" data-position="left" data-display="push">[nav code here]</div> 
    <div data-role="header">[header code here]</div> 
    <div data-role="main">[main content code here]</div> 
    <div data-role="footer">[footer code here]</div> 
</div>

источник

2014-11-11 Melissa Hie

я ненавижу просить очевидное, но она выглядит на странице child.html не включает в себя полную разметку, что делает index.html , Каждая отдельная страница на веб-сервере должна содержать полную разметку, включая html, тело и весь импорт. – erikrunia

Я думал, что это должен быть смысл JQM. Он вводит вторую страницу в DOM (или что-то в этой строке), и вам нужно включать только данные-role = page HTML на другие страницы ... кажется, это работает, потому что мой CSS загружается, но JS не работает. –

Я ничего не вижу из глазного кода, который выглядит хорошо для меня. Можно ли построить образец для тестирования. Я считаю, что «плункер» может быть инструментом для использования? – Kolban

Фигурного его. Оказывается на моем собственном JS, мы не можем использовать document.ready для JQM. Поэтому я использовал $(document).on('pageinit', function() {});, и он загрузился нормально, хотя мне нужно было сделать тонкую настройку для вкладок jquerymobile.

Смотрите эту ссылку для более подробного объяснения о том, почему это произошло: jQuery Mobile: document ready vs page events

источник

2014-11-11 05:58:13

jquery mobile - JS не выполняется на второй странице приложения с несколькими HTML

ответ

Смежные вопросы