html5boiler plate + jquery mobile = загрузка скриптов дважды - PullRequest
Новая
       19

html5boiler plate + jquery mobile = загрузка скриптов дважды

2 голосов
/ 19 ноября 2011

Я работаю над экспериментальным мобильным приложением jquery, используя шаблон html5 в качестве основы для html и т.*

Скачайте и распакуйте шаблон html5 и просмотрите его в браузере.Убедитесь, что скрипты / стили загружаются правильно.Хорошо готов к работе. Добавить jquery mobile (cdn размещена полная версия 1.0 [выпущена сегодня? Отлично!]) Добавить $(document).ready(function () { console.log('ready'); }); Обновить.'ready' выводится дважды ... второй после небольшой задержки .. wtf bbq и такая ситуация проверки в Chrome Inspector ... обратите внимание, что все файлы JavaScript загружаются дважды. Перезапустите с нуля, распакуйте загрузку h5bp в браузере, обратите внимание, в частности, на то, что скрипты загружаются один раз.Добавьте обработчик готовности документа, наблюдайте один вывод команды «ready». Добавьте загружаемые сценарии jquery mobile наблюдений один раз. Переместите все сценарии в тег.Скрипты загружаются один раз.

Кто-нибудь знает, что происходит?Это должно быть довольно легко воспроизвести, просто извлеките h5bp и добавьте jquery mobile в раздел скриптов внизу, и вдруг скрипты все загружаются дважды.Переместите все эти скрипты в тег head под (или до) модернизатора, и это больше не происходит.

Спасибо

Ответы [ 5 ]

3 голосов
/ 21 ноября 2011

Modernizr использует YepNope для загрузки скриптов. Если вы посмотрите на проблему здесь: https://github.com/SlexAxton/yepnope.js/issues/10

вы увидите, что скрипты намеренно загружаются дважды:

Yepnope запрашивает каждый файл, который вы в него вставляете, дважды. Первый раз он загружается в ваш кеш как некая исполняемая сущность (элемент объекта, или элемент img, или элемент скрипта с подделкой тип атрибута, в зависимости от вашего браузера). Второй раз это мы вводим его как исполняемый скрипт, и на этот раз кэшируются. Так что на самом деле это только миллисекунда или меньше, что требуется выполнить функцию обратного вызова и повторно добавить тег сценария дополнительно (и сколько времени потребуется для доступа к кешу).

На домашней странице http://yepnopejs.com также упоминается об этом. Просто зайдите туда и прокрутите вниз до I'm seeing two requests in my dev tools, why is it loading everything twice?

2 голосов
/ 20 октября 2012

Поместите <script>document.ready()</script> в <head></head>, чтобы решить эту проблему.

1 голос
/ 25 января 2012

Используете ли вы $ (document) .ready () ??

Столкнулся с этой же проблемой и был без конца разочарован, заметил, что если я переместил все JS в заголовок документа, он работалхорошо.Когда я переключил все на использование Pageinit, он начал работать должным образом с JS внизу страницы, где он находится.

пример: 

<div id="mainPage" data-role="page">
    <script type="text/javascript">
        $("#project_map_page").live('pageinit', function() {
        // INSERT JS HERE
        });
    </script>
</div>

дополнительные детали доступны по адресу: http://jquerymobile.com/demos/1.0/docs/api/events.html

0 голосов
/ 10 мая 2012

Убедитесь, что ваш корневой div похож на это ... 

<body>
<div data-role="page">
 <!-- Content -->
</div>
</body>
0 голосов
/ 21 ноября 2011

Я пытался добавить jQuery и jQuery Mobile на основную html-страницу, похоже, это тоже происходит. Так что не думайте, что это связано с h5bp. Не могли бы вы попробовать удалить h5bp и снова загрузить?

...