Как улучшить динамически создаваемое меню выбора в JQuery Mobile

Question

Я использую многостраничный шаблон (JQM) и создал один HTML-файл с 2 страницами (Page0 и Page1). Обе страницы имеют один и тот же элемент selectmenu, который динамически создается при загрузке страницы.

По какой-то причине у элемента selectmenu в Page1 есть некоторые проблемы со стилем (похоже, что некоторый стиль CSS не был применен правильно и / или элемент не был правильно расширен), тогда как тот, что на главной странице, выглядит нормально.

Пожалуйста, перейдите по следующей ссылке, чтобы увидеть проблему в действии:

http://jsfiddle.net/dalsword/pdnpyh5h/5/

<div data-role="page" id="first">
  <div data-role="header">
    <h3>
      First Page
      <a href='#second' class='ui-btn-right ui-icon-back ui-btn ui-corner-all ui-shadow'>NEXT</a>
    </h3>
  </div>

  <div data-role="content">
    <div class='ui-field-contain'>
      <label for='g1'>SELECT MENU</label>
      <select id='g1' data-native-menu='false'>
      </select>
    </div>
  </div>
</div>

<div data-role="page" id="second">
  <div data-role="header">
    <h3>
      First Page
    </h3>
  </div>

  <div data-role="content">
    <div class='ui-field-contain'>
      <label for='g2'>SELECT MENU</label>
      <select id='g2' data-native-menu='false'>
      </select>
    </div>

  </div>

</div>


$(document).ready(function(e) {


  var content = "<option value='1'>element 1 </option>";
  content += "<option value='2'>element 2 </option>";
  content += "<option value='3'>element 3 </option>";
  content += "<option value='4'>element 4 </option>";
  content += "<option value='5'>element 5 </option>";


  var mySelect = $('#g1');
  mySelect.empty().append(content);
  mySelect.selectmenu().selectmenu('refresh');

  var mySelect = $('#g2');
  mySelect.empty().append(content);
  mySelect.selectmenu().selectmenu('refresh');


});

Я использую:

• Jquery мобильный 1.4.5
• Jquery 1.11.1

Какие-либо предложения?

Answer 1

Во втором меню меняется

mySelect.selectmenu().selectmenu('refresh');

в

mySelect.selectmenu('refresh');

будет работать, потому что 2-е selectmenu уже инициализировано.

Пример JSFiddle