Как многие предлагали использовать отложенный вариант, это приемлемый вариант, если вам все равно, в каком порядке deviceready
и что mobileinit
происходит. Но в моем случае мне понадобилось несколько pageshow
событий при первой загрузке приложения и, mobileinit
соответственно, эти события pageshow
/ pagebeforeshow
/ etc были все стрельбы до deviceready
завершения, поэтому я не мог правильно привязать к ним, используя отложенный для них. Это состояние гонки было не очень хорошо.
Что мне нужно было сделать, так это убедиться, что 'mobileinit' не произойдет до тех пор, пока ' deviceready
' уже не будет запущен. Поскольку mobileinit
срабатывает сразу при загрузке JQM, я решил использовать его jQuery.getScript
для загрузки ПОСЛЕ того, как deviceready
он уже был завершен.
<script src="cordova-2.2.0.js"></script>
<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/async.min.js"></script>
<script src="js/app.js"></script>
<script>
document.addEventListener(
'deviceready',
function () {
$('body').css('visibility', 'hidden');
$(document).one("mobileinit", function () {
app.init();
$('body').css('visibility', '');
});
$.getScript('js/jquery.mobile-1.2.0.min.js');
},
false
);
</script>
Причина, по которой я скрываю тело, заключается в том, что побочным эффектом этого метода является полсекунды видимости исходного HTML-документа до загрузки jquery.mobile. В этом случае скрытие лишних полсекунды пустого пространства предпочтительнее, чем просмотр документа без стиля.