2012-04-26 2 views
2

Заранее спасибо за ознакомление с этим вопросом jQuery Mobile (версия 1.1.0).jquery mobile, pageinit, pagecreate, and redundancy

Мой первый вопрос: какую функцию вы используете для запуска при каждой загрузке страницы и каждом вызове страницы ajax (они кажутся двумя отдельными животными)? Я хочу, чтобы они запускались каждый раз.

У меня есть несколько разделенных jQuery-мобильных HTML-страниц с использованием кода jQuery для различных функций. Некоторые из этих функциональных возможностей включают в себя сенсорный слайдер (royalSlider), который происходит на нескольких страницах, некоторые из кодов нюхают, существуют ли определенные элементы (например, фиксированный подзаголовок или нижний колонтитул) для корректировки полей для страницы, чтобы основное содержимое было затруднено с помощью перекрывающихся элементов, а другой js - это скрипт, который обращается к каждому элементу с определенным классом, который запускает вызов AJAX для каждого изображения.

Вопрос: нужна ли мне функция liveinitin для каждого идентификатора каждой страницы? Нужно ли использовать pageinit AND pagecreate для каждой страницы?

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

Теоретически, не могу ли я запустить такую ​​функцию, которая попадает на каждую активную страницу при посадке на страницу или потянув страницу через AJAX?

$('[data-role="page"].ui-page-active').live('pageinit', function(){ 
    face(); 
}); 

нет:

$("#brand-grid,#product-grid,#main-grid,#trends").live('pageinit', function() { 
    face(); 
}); 

Что я нахожу, что это работает, когда я землю на странице, которая нуждается смещение на первом, но при переходе на другую страницу, она больше не работает. Это потому, что в DOM есть 2 div [data-role = "page"], и моя команда слишком неоднозначна? Или это потому, что pageinit работает только для исходной страницы, а не для содержимого AJAX'd?

Мой следующий вопрос: Как вы уничтожаете страницу после того, как вы перешли от нее? Я не хочу, чтобы на планшете было запущено 2 экземпляра royalSlider, если я могу помочь.

Вот моя попытка:

$('[data-role="page"].ui-page-active').live('pageinit', function(){ 
    $('[data-role="page"]:not(.ui-page-active)').live('pageremove'); 
}); 

Любое понимание у вас есть было бы здорово, я просто хочу, чтобы избежать утечки памяти и низкой производительности. JQM был довольно впечатляющим, чтобы развиваться в стороне от этих темпераментных проблем. Спасибо.

ответ

2

Если вы хотите запустить функцию каждый раз, когда страница загружается через использование Ajax

$(document).bind('pageinit') 

http://jquerymobile.com/test/docs/api/events.html

Я думаю, что вы можете сделать что-то подобное для удаления страницы с

$(document).bind('pageremove') 
+0

Хорошо, так что $ (document) .bind ('pageinit') происходит при каждой загрузке через AJAX. Как насчет начальной загрузки страницы (не AJAX) и как вы нацеливаете элемент DOM на то, когда после загрузки второй страницы первая страница «скрыта» за первым в DOM? Существует ли конкретный селектор для таргетинга на ACTIVE [data-role = "page"]? – j0e

+1

Pageinit происходит на каждой странице ajax pageload или нет. – xanderer

+0

Это случается для каждой pageload * кроме * начальной загрузки страницы. Каждый раз, когда я нажимаю ссылку linkinit fire, но когда я обновляю страницу, это не так. Если у меня что-то не так. –

1

Notice тоже, что в jQuery mobile вы не можете дублировать идентификаторы на разных страницах. Идентификаторы должны быть разными, даже если элементы находятся на разных страницах, так как страницы добавляются в документ.Больше (и лучше) объяснение:

https://forum.jquery.com/topic/pageinit-firing-twice#14737000002873163

2

Ответ на вопрос # 1:

Я считаю, что у меня была такая же проблема, как вы, и вот как я ее решил: В обработчике pageinit, вам должен включать параметр события, потому что целью события является div новой страницы (т. е. div с data-role = "page"), поэтому вы можете использовать цель как контекст в любых селекторах jQuery, которые вы используете для таргетинга на элементы DOM на этой странице, например:

$(document).on('pageinit', function(event) { 
    $('#some-element', event.target).toggle(); 
}); 

Ответ на вопрос # 2:

Я думаю, вы можете сделать то же самое в своем обработчике для pageremove.

Смежные вопросы