#jquery #jquery-mobile
#jquery #jquery-mobile
Вопрос:
У меня проблема при загрузке содержимого с
$('#next').click(function(){
$('#boundary').load('options.html #pagecontent').page();
});
Проблема в том, что div #pagecontent находится в options.html загружается, но не в предназначенные элементы jquery mobile.
в options.html с идентификатором = содержимое страницы отображается нормально, если вы предварительно просматриваете эту страницу. только когда я пытаюсь загрузить его на другую страницу div с id =»boundary», весь рендеринг jquery mobile завершается неудачей, и элементы вместо этого просто загружаются как собственные HTML-элементы.
в options.html : стандартный div, содержащий некоторые элементы пользовательского интерфейса.
<div id="pagecontent">
// Jquery mobile button
<a href="results.php" data-transition="fade" id="result" data-role="button" data-theme="e" rel="external">View results</a>
</div>
Спасибо
Комментарии:
1. Да (вы должны показать некоторый код, чтобы получить более подробный ответ)
2. исходный вопрос был отредактирован @naugtur.
3. является ли пробел между options.html а #pagecontent правильный? разве это не должно быть options.html#pagecontent
4. да, @ phil пробел правильный.
Ответ №1:
Это всего лишь предположение, но зачем вы пишете код для загрузки div страницы из html-файла, если jQuery Mobile делает это по умолчанию, когда пользователь нажимает на ссылку на страницу?
Я рекомендую не писать собственную поддержку AJAX, если она не предназначена для загрузки данных, которые вам нужно проанализировать и изменить перед добавлением на страницу.
Комментарии:
1. Я подумал о том, что вы сказали, и это очень верный момент. Идея состояла в том, чтобы загружать страницы частями, которые будут меняться, т.Е. без обязательной отправки каких-либо данных, но я подумал, что этот метод поможет оптимизировать переходы между различными частями приложения. Имеет ли это смысл?
2. Да, это рекомендуемый способ. И вы также должны выполнить разбивку на страницы старым способом, например.
some.php?page=3
или [при использовании хороших ссылок]some/3
НЕ с помощью каких-либо способов, не основанных на URL, таких как сохранение его в сеансах (этот пример может быть не лучшим, потому что такое разбиение на страницы, как правило, плохо ;))
Ответ №2:
Попробуйте добавить .page()
$('#boundary').load('options.html#pagecontent').page();
Может быть, связано с функцией click
$('#next').click(function(){
$('#boundary').load('options.html#pagecontent');
}).page();
Комментарии:
1. это не сработало, Фил. Я заново отредактировал вопрос, чтобы включить больше.
2. можете ли вы также сказать мне, что делает page ()?
3. .page () перезагружает / обновляет элементы управления jQM, насколько я понимаю
4. К вашему сведению, то, что вы сказали, — хороший способ подумать об этом, но на самом деле это центральный виджет, который просматривает html во время инициализации страницы и запускает другие виджеты и добавляет классы для стандартных элементов. Полезно знать об этом. Это помогает вам понять, почему иногда это не работает с определенными битами html при вызове их вручную, в то время как те же самые биты просто прекрасны, когда не добавляются динамически.
Ответ №3:
У меня была похожая проблема, и я нашел решение для принудительного рендеринга загруженных divs в jquery mobile. Я знаю, что этот ответ пришел к вам очень поздно, но, возможно, он поможет другим с подобными вопросами:
$('#next').click(function(){
$('#boundary').load('options.html #pagecontent');
$('#boundary').trigger("pagecreate").trigger("refresh");
});
У меня это работает с использованием jquery mobile 1.1.0 (я не тестировал со старыми версиями)