Как правильно делать $ (document) .ready в jQuery Mobile? - PullRequest
19 голосов
/ 28 июля 2011

Предположим, я хочу запустить некоторый код, как только jQuery Mobile закончит рендеринг пользовательского интерфейса.Событие mobileinit не работает, так как оно поднято до , это происходит.Быстрый поиск в Google показывает, что простое использование $(document).ready не будет работать с JQM;но я только что попробовал (названный после mobileinit), и это сработало для меня: мой код работал и динамически обновляемые элементы и т. д. просто отлично.Так что мне интересно, есть ли причина, по которой я не должен использовать его (это ненадежно или портит JQM), или информация о нем не работает просто неточно?Чего мне не хватает?

Обновление : см. здесь для демонстрации.

1 Ответ

12 голосов
/ 28 июля 2011

Скорее всего, причина, по которой вы прочитали, что $ (document) .ready не будет работать с jQuery Mobile, заключается в том, что он не срабатывает каждый раз, когда вы просматриваете псевдостраницу. Тем не менее, он по-прежнему срабатывает, как и при загрузке HTML-документа.

Если вы хотите запускать код, который запускается каждый раз, когда вы просматриваете псевдостраницу, вы можете использовать этот код:

$('[data-role="page"]').live('pageshow', function () {
    //run your code here
});

ПРИМЕЧАНИЕ: есть и другие хуки, с которыми вы можете связать (pagehow, pagehide, pagebefoershow, pagebeforehide), документацию можно найти здесь: http://jquerymobile.com/demos/1.0b1/docs/api/events.html

---------- РЕДАКТИРОВАТЬ ----------

Я думал об этом, и лучший аналог $ (document) .ready () не привязан к событию "pageshow", он будет привязан к событию "pagecreate". $ (document) .ready () запускается один раз для каждой загрузки страницы, а «pagecreate» делает то же самое для псевдостраниц, тогда как «pageshow» срабатывает каждый раз, когда отображается страница.

Таким образом, если пользователь щелкнул на главном экране, а затем нажал кнопку «Назад», чтобы вернуться на домашний экран, на этой второй (и последующих) «показах» домашнего экрана будет запущено «pagehow».

Кроме того, «pageshow» требует от пользователя перехода на страницу, к которой он привязан.

...