У нас есть производственный jQM-сайт. Вот как мы это делаем. Да, другие могут не согласиться, но мы обнаружили, что это работает для очень большого сайта.
Использование нескольких отдельных HTML-страниц,Большой многостраничный шаблон лишает преимущества загрузки jjM в ajax, так как вы загружаете весь свой HTML в начале (если ваш сайт не маленький)
Вы определенно хотите использовать загрузку ajax,jQM извлекает только код из вашего <div data-role="page">
НО это усложняет ваш JS, см. ниже
Вам не нужно несколько файлов JS, НО вам нужно загрузить все свои JS наДля начала мы выполняем это, выполняя две вещи: 1. , помещаем прослушиватель on
в корень документа и прослушиваем события pageinit / pageshow.Каждый раз, когда страница загружается, они запускаются, у вас также есть удобная ссылка на текущую страницу, и вы можете использовать attr на странице, чтобы определить, какая это была страница. 2. Имейте все JS во включении какого-либо типа (надеюсь, вы используете PHP, CF или что-то еще) и размещайте это на каждой странице, таким образом, независимо от того, какую точку входа пользователь просматривает на вашем мобильном сайтес, они получают весь загруженный код
Недостатком является то, что весь JS загружается изначально, но при минимизации мы находим, что это не имеет большого значения, и если это действительно проблема, загляните в RequireJS -Кроме того, это облегчает отладку, поскольку JS - это все, что мы можем легко использовать отладчик и устанавливать точки останова.Если вы загружаете JS динамически на каждой странице, вы увеличиваете объем данных, которые необходимо возвращать на каждой странице, и у вас возникает уродство, потому что вы перезагружаете избыточный JS и трудно отлаживать динамический JS.
$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function(oEvent){
var pageType = $(this).data('pagetype');
//handle pageinit/pageshow (oEvent.type) for each pageType