Что вы видите / не видите точно?Я поместил ваш код на страницу jQuery Mobile, и в заголовке страницы я получил поле выбора, как и ожидалось.Вот фрагмент кода, который я использовал, который проверяет OK в Desktop и Mobile Safari (iPad):
<body>
<div data-role="page" id="somepage" data-theme="c">
<div data-role="header" data-position="inline" data-theme="b">
<h1>My Page</h1>
<select>
<option>Option 1</option>
<option>option 2</option>
</select>
</div>
<!-- rest of page -->
</div>
<body>
EDIT Я думаю, что проблема, с которой вы столкнулись, заключается в том, что h1конечно, блочный элемент, как и поле select, когда jQM запустит свой код.Если вы проверите поле после визуализации страницы в браузере WebKit, вы увидите, что jQM применяет дополнительные div-ы и т.п., что означает, что поле выбора не может легко находиться в той же строке, что и ваш заголовок.
Согласно документации, вам нужно поэкспериментировать с пользовательской разметкой в заголовке, поместив ее в свой собственный div (чтобы jQM не пытался манипулировать ею), а затем стилизовать ее самостоятельно.Вид, которого вы хотите добиться, лучше всего делать при создании панели заголовка с двумя ссылками, но, очевидно, это не относится к вам, поскольку вторая «кнопка» не является ссылкой, это поле select:
Плагин заголовка ищет непосредственные дочерние элементы контейнера заголовка и автоматически устанавливает первую ссылку в левом слоте кнопки, а вторую ссылку - в правой.В этом примере кнопка «Отмена» появится в левом слоте, а кнопка «Сохранить» появится в правом слоте в зависимости от их последовательности в исходном порядке.
Вы можете попробовать сделать что-то подобноечтобы выдумать, но вам нужно протестировать на устройствах, которые вы поддерживаете в своем приложении (и, очевидно, поместить стили в класс, я сделал это только для примера):
<div data-role="header" data-position="inline" data-theme="b">
<h1>My Page</h1>
<div data-role="fieldcontain" style="position: absolute; top: 0; right: 0; margin: 0; padding: 0">
<select>
<option>Option 1</option>
<option>option 2</option>
</select>
</div>
</div>
...