jquery mobile 选择的选项未在 'refresh' 上更新

Question

使用 jQueryMobile，当我更改选择小部件的内容然后对其调用“刷新”时，所选选项的文本不会更改。这是场景...

“选择”小部件已存在于页面 div 中。当用户转到该屏幕时，会根据他们选择用于转到该页面的按钮动态创建选项。此选项列表是按照

$('#searchReasonList').append(optionList)

The first time into the new page all works well. When they navigate away and come back in, I do

$('#searchReasonList').empty()

Then I build the correct option list and do the same append and call:

$('#searchReasonList').selectmenu('refresh',true)

The native select is indeed refreshed, and I am able to choose from the options. However, the selected option doesn't show up. Only the placeholder is seen.

To show the enhanced markup:

<div class="ui-select">
  <div class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-up-c" data-theme="c">
    <span class="ui-btn-inner ui-btn-corner-all">
      <span class="ui-btn-text">Select Reason</span>
      <span class="ui-icon ui-icon-arrow-d ui-icon-shadow"></span>
    </span>

    <select id="searchReasonList" name="searchReasonList" data-placeholder="true">
      <option value="">Select Reason</option>
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
    </select>
  </div>
</div>

构建和添加的

这是带有 class='ui-btn-text' 的 span 标记，未使用所选选项的标签进行更新。它只是保留“搜索原因”，这是我的占位符的标签。

还有什么需要做的吗？

Answer 1

使用 jQuery 1.0.1(目前最新的稳定版本)，您可以使用 .selectmenu('refresh') 刷新选择小部件。

$('select').empty().append('<option value="foo">Bar</option>').selectmenu('refresh');

这是一个演示:http://jsfiddle.net/4Thzt/

当您使用 $('select').selectmenu('refresh', true); (注意 , true)时，您将强制小部件不这样做只刷新，但重建，这将始终显示占位符文本。 来源:http://jquerymobile.com/demos/1.1.0-rc.1/docs/forms/selects/methods.html