javascript - JQuery - 从 Selectbox 中删除所有选项，除了 first 和 selected

Question

我有一个带有多个选项的 html 选择框。选择一个选项后，我只想在选择选项下拉列表中显示所选选项和第一个选项。我知道如何过滤并只显示一个选项，但我不知道如何在“已选择”选项保持“已选择”的情况下包含这两个选项。我包含了类似于我的代码的片段以及演示。

HTML:

<select id="myDropdown">
<option selected>Select fruit</option>
<option>Grapes</option>
<option>Bananas</option>
<option>Oranges</option>
<option>Apples</option>
</select>

JS:

$(document).on('change', '#myDropdown', function() {
    $('option', this).not(this,'option:gt(0)').siblings().remove(); });

我正在尝试使用第一个选项来执行“更改时”的另一个功能，因此我需要选定的选项保持选中状态，同时过滤掉除第一个选项之外的其余选项。例如，如果选择了“橘子”，您将看到以下内容:

<select id="myDropdown">
     <option>Select fruit</option>
     <option>Oranges</option>  //selcted value
</select>

顺便说一句，我也在使用 jquery mobile 来设计样式。

jsfiddle

Answer 1

.not只需要 1 个参数。如果要过滤两个不同的选择器，可以在字符串内的它们之间添加一个逗号。您还可以使用 :selected选择器:

$('option', this).not(':eq(0), :selected').remove();

请参阅更新的 fiddle :http://jsfiddle.net/znx9hxvu/9/