Question

我有一个类似于以下代码的精美选择，但是将selected=selected属性添加到其中一个选项（使用JS）并不会改变当前选择的项目。

<li class="field">
  <div class="picker">
    <select>
      <option value="#" disabled>Favorite Doctor…</option>
      <option>Colin Baker</option>
      <option>Sylvester McCoy</option>
      <option>Paul McGann</option>
      <option>Christopher Eccleston</option>
      <option>David Tennant</option>
      <option>Matt Smith</option>
    </select>
  </div>
</li>

如何更改所选选项并将此更改反映在选择框中。

Answer 1

设置所选选项后尝试触发更改事件，例如：

$('option:eq(2)').prop('selected',true).trigger('change'); // or .change()

<强> Fiddle Demo

Answer 2

通过将select.val()设置为我正在尝试选择的选项的文本来解决此问题。

Answer 3

我通过修补FS的代码解决了这个问题。它使用:selected作为选择器。将其更改为[selected="selected"]并且表现良好。在我看来，最好完全避免使用FS。我在一个正在进行的项目中继承了它。

我的副本中的第56行，现在改为：

triggerHtml = settings.triggerTemplate(sel.find('[selected="selected"]'));

使用花式选择选择选项

3 个答案: