jQuery Mobile: о контейнере страницы ($ .mobile.pageContainer)

$ .mobile.pageContainer - это элемент, содержащий другие виртуальные страницы. Он установлен в <body>. Поэтому я предполагаю, что его можно изменить. В самом деле, некоторые методы JQM (changePage) позволяют указать нестандартный контейнер страницы для страницы. В документах JQM отсутствуют необходимые данные. So мои вопросы таковы:

Можете вы изменить контейнер страницы по умолчанию в разметке/коде? Как?
В чем причина наличия контейнера страницы, кроме <body>?
Означает ли это, что может быть несколько контейнеров страниц с некоторыми «страницами», находящимися в одном контейнере страницы и другими «страницами», находящимися в других контейнерах? Зачем вам это делать?

источник

2013-11-13 srgstm

Хорошо, я провел несколько тестов при загрузке страниц в другой контейнер. Похоже, что они предназначены для загрузки дополнительных страниц, которые вы хотите показывать только один раз, когда они исчезают, как только вы оставляете их обратно в оригинальный контейнер. Кроме того, если вы используете следующий/задний или проведите пальцем влево/вправо, они не будут отображаться в последовательности страниц. – Omar

1 Вы можете разместить свои разделители страниц внутри элемента контейнера в разметке.

2 Я использую ASP.Net Webforms, для которого требуется элемент FORM, поэтому иногда я добавляю свои страницы jQM в ФОРМУ верхнего уровня вместо тела, позволяя мне использовать элементы управления ASP.Net на моих отдельных страницах при использовании одной и той же FORM элемент.

3 Я думаю, вам нужно сохранить все страницы в одном контейнере, в противном случае ссылки между страницами сломаются. Вот jsFiddle с 2 страницами в контейнере, связывающем друг с другом. Попробуйте поместить их в отдельные контейнеры, и вы увидите, что ссылка перестает работать.

<div id="PageContainer1"> 
    <div data-role="page" id="page1"> 
     <div data-role="header"> 
      <h1>My page 1</h1> 
     </div> 
     <div data-role="content"> <a href="#page2" data-role="button">Go to Page 2</a> 
     </div> 
    </div> 
<!-- insert separate container here 
</div> 
<div id="PageContainer2"> 
--> 
    <div data-role="page" id="page2" data-theme="a"> 
     <div data-role="header"> 
      <h1>My page 2</h1> 
     </div> 
     <div data-role="content"> <a href="#page1" data-role="button">Go to Page 1</a> 
     </div> 
    </div> 
</div>

UPDATE: Как было отмечено в комментариях, вы можете, конечно, перемещаться по страницам в других контейнерах через changePage, только стандартный HREF = «# PAGE2» ссылки сломаться.

$.mobile.changePage("#page2", {"pageContainer": $("#Container2")});

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

источник

2013-11-13 14:33:05 ezanker

Правильно ли я сказал бы, что для устранения ограничений на публикацию скрипта без кода в вопросе использовался сокращенный URL-адрес? Внешние сайты могут быть темными в любое время, и есть надежда, что эти вопросы будут иметь долгосрочное использование. –

Ричард, я не мог бы добавить код с списком с автоматическим номером, он просто рассматривал его как HTML. Я обновил ответ, удалив автоматическую нумерацию, а затем вставив код. Благодаря! – ezanker

По-видимому, JQM устанавливает $ .mobile.pageContainer родительскому элементу первой [data-role = 'page'], с которой он сталкивается. Тем не менее, до сих пор неясно, почему методы навигации JQM (changePage, loadPage) позволяют указать другой контейнер с нестандартной страницей. – srgstm

jQuery Mobile: о контейнере страницы ($ .mobile.pageContainer)

ответ

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