jQuery Mobile - запуск показа страниц только один раз

Question

Я пытаюсь выполнить фрагмент JS только один раз, после того, как страница полностью загружена и JQM позаботился обо всех изменениях пользовательского интерфейса (например, просмотр списка, кнопки и т. Д.).Я хочу, чтобы он выполнялся только на этой странице, а не на последующих страницах.

Сначала я попробовал: pageshow

<script>
$('[data-role=page]').live("pageshow", function() {
    alert("Ready!");
}); 
</script>

Проблема заключается в том, что функция теперь подключена кстраница div и выполняется каждый раз, когда отображается любая последующая страница.Однако я хочу, чтобы это выполнялось только один раз и только для страницы, содержащей этот фрагмент JS.

Есть ли способ прослушивания события pagehow, без фактического присоединения к нему функции.

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

<script>
$('[data-role=page]').bind("pageshow.test", testfun);

function testfun() {
    alert("Ready!");
    $('[data-role=page]').unbind("pageshow.test", testfun);
}   
</script>

Но есть ли более элегантный способ сделать это?

Answer 1

jQuery имеет функцию one для привязки обработчика событий, который будет выполнен только один раз.Проверьте ссылку .

Answer 2

Событие pageinit запускается один раз на страницу сразу после того, как платформа jQuery Mobile инициализирует свои виджеты;Я думаю, что это может быть то, что вы ищете.

pageinit

Инициируется на инициализируемой странице после инициализации.Мы рекомендуем связываться с этим событием вместо DOM ready (), потому что это будет работать независимо от того, загружается ли страница напрямую или содержимое перетаскивается на другую страницу как часть системы навигации Ajax.

Источник: http://jquerymobile.com/demos/1.1.0-rc.1/docs/api/events.html

Если вы хотите привязать к определенной странице, а не к остальным, выберите только страницу, которую хотите изменить ... Вот пример:

<script>
$(document).delegate('#my-page-id', 'pageinit', function() {
    alert("PageInit!");
}); 
</script>