Как быть СУХИМ в jQuery Mobile?

Я разрабатываю мобильное приложение, используя PhoneGap и jQuery Mobile. Я хотел бы, чтобы мои файлы просмотра были СУХИМИ. Как мне добиться этого в jQuery Mobile? Должен ли я просто поместить каждый элемент страницы в один файл HTML?


person StackOverflowNewbie    schedule 14.08.2013    source источник


Ответы (1)


Именно для этого и предназначен jQuery mobile, и я — лучший подход, которому нужно следовать.

у вас может быть что-то вроде этого:

<html>
<head>
   <script src="jquerymobilelibrary.js"/>
</head>
<body>
  <div data-role="page" id="page1">
    <div data-theme="a" data-role="header"><h3>Header</h3></div>
    <div data-role="content">
        <div data-role="fieldcontain">
            <label for="textinput2">Title</label>
            <input name="" id="textinput2" placeholder="" value="" type="text">
        </div>
        <a data-role="button" href="#page2">Button</a>
    </div>
  </div>

  <div data-role="page" id="page2">
    <div data-theme="a" data-role="header"><h3>Header</h3></div>
    <div data-role="content">
        <!-- Content is empty -->
    </div>
  </div>
</body>
</html>

Для программного переключения между страницами в JS вы можете использовать

<script>
  $.mobile.changePage('#page2')
</script>

На сайте jquery mobile есть простой, но классный конструктор пользовательского интерфейса с возможностью перетаскивания, позволяющий изучить возможности библиотеки JQM.

Надеюсь, поможет!

person Saxophonist    schedule 14.08.2013
comment
Итак, все в одном HTML-файле? Я могу жить с этим, я думаю. Что делать, если некоторые страницы имеют одинаковый верхний или нижний колонтитул? Как мне сохранить это СУХИМ? - person StackOverflowNewbie; 15.08.2013
comment
Да, ты можешь. :) Это довольно легко поддерживать. Если у них одинаковый верхний/нижний колонтитул, вы можете использовать свойство data-id с тем же идентификатором. Проверьте это: goo.gl/MmktFF и попробуйте здесь: goo.gl/wobqh6 (если поможет, отметьте как правильный ответ :]) - person Saxophonist; 15.08.2013
comment
Я думаю, это делается для того, чтобы верхний/нижний колонтитул был постоянным, верно? Я пытаюсь повторно использовать один и тот же заголовок на разных страницах. Мой вопрос касается того, чтобы быть СУХИМ. - person StackOverflowNewbie; 15.08.2013
comment
Вы можете добиться этого, добавляя страницы и/или внося изменения динамически. Вы по-прежнему можете подключать прослушиватели событий и манипулировать DOM. - person Omar; 24.08.2013