jQuery 删除选择框的所有选项，除了第一个选项

removing all options of select box except 1st option

提问by da-hype

I'm trying to empty select options when:

在以下情况下，我试图清空选择选项：

id "mClick" is selected, id's "sClick", "cClick" and "srClick" will be emptied.

id“mClick”被选中，id的“sClick”、“cClick”和“srClick”将被清空。

id "sClick" is selected, id's "cClick" and "srClick" will be emptied.

id "sClick" 被选中，id 的 "cClick" 和 "srClick" 将被清空。

id "cClick" is selected, id "srClick" will be emptied.

id "cClick" 被选中，id "srClick" 将被清空。

<form action="javascript:void(0);" method="POST" id="lForm">
<table>
    <tr>
        <td>
            <select name="module" id="mClick">
                <option value="">Select Mod</option>
                <option value="1">Mod 1</option>
                <option value="2">Mod 2</option>
                <option value="3">Mod 3</option>
            </select>
        </td>
        <td>
            <select name="state" id="sClick">
                <option value="">Select State</option>
                <option value="1">State 1</option>
                <option value="2">State 2</option>
            </select>
        </td>
        <td>
            <select name="city" id="cClick">
                <option value="">Select City</option>
                <option value="1">City 1</option>
                <option value="2">City 2</option>
            </select>
        </td>
        <td>
            <select name="services" id="srClick">
                <option value="">Select Services</option>
                <option value="1">Services 1</option>
                <option value="2">Services 2</option>
            </select>
        </td>
    </tr>
</table>

in scenario 3, i used this function, but it deleted all, except the last select. Any idea's what i'm missing? Thanks

在场景 3 中，我使用了这个功能，但它删除了所有，除了最后一个选择。知道我缺少什么吗？谢谢

$('#lForm select[id!="mClick"] select[id!="sClick"] select[id!="cClick"] option[value!=""]').remove().end();

采纳答案by Ja?ck

The easiest way to clear the options in the way you're describing is by using options.length = 1. Also, you can leverage the fact that each drop down clears the ones that logically follow it, so that you only need to declare a single change handler.

以您描述的方式清除选项的最简单方法是使用options.length = 1. 此外，您可以利用每个下拉菜单清除逻辑上跟随它的下拉菜单这一事实，这样您只需声明一个更改处理程序。

$('#lForm select').on('change', function() {
  if (this.selectedIndex > 0) {
    var $others = $(this).closest('table').find('select'),
    current = $others.index(this); // find current

    while (++current < $others.length) {
      // for each following drop down
      $others.get(current).options.length = 1;
    }
  }
});

Demo

演示

I'm not sure how you're going to repopulate the drop downs though :)

我不确定你将如何重新填充下拉菜单:)

回答by Dawid Ku?mierek

Try this

尝试这个

yourSelect.find('option').not(':first').remove();

回答by Sudi065

I was looking for one line code, what I found after lots of research is the Simplest and Best one line code to remove everything except first.

我一直在寻找一行代码，经过大量研究，我发现最简单和最好的一行代码可以删除除第一行之外的所有内容。

JQuery,

查询，

$('#ddlId option:not(:first)').remove();

回答by U.P

you can use the greater than :gt()selector of jQuery for this

您可以:gt()为此使用jQuery的大于选择器

$('#lForm select[id!="makeClick"] select[id!="stateClick"] select[id!="cityClick"] option:gt(0)').remove().end();

This will remove all options that are greater than 0

这将删除所有大于 0 的选项

回答by Satpal

You can use not(:first)

您可以使用 not(:first)

$('#lForm select[id!="makeClick"] select[id!="stateClick"] select[id!="cityClick"]  option:not(:first)').remove().end();

回答by Renish Patel

It's Work

这是工作

$('#mClick').change(function () {
    $('#sClick, #cClick, #srClick').find("option:gt(0)").remove();
});
$('#sClick').change(function () {
    $('#cClick, #srClick').find("option:gt(0)").remove();
});
$('#cClick').change(function () {
    $('#srClick').find("option:gt(0)").remove();
});

回答by Stark

asssign general class to your Dropdown then

然后将通用类分配给您的下拉列表

$('.general option[value!=""]').remove();

$('.general option[value!=""]').remove();

this will remove all options except first one whose value is empty Hope this will helps

这将删除所有选项，除了第一个值为空的选项希望这会有所帮助

回答by M.G.Manikandan

Try this

尝试这个

$('#lForm select').change(function(){
   var $selects = $('#lForm select');
   var idx = $selects.index(this);

   // Use `val` function to clear the selected values or Use `remove` function to remove the element.
   $selects.filter(':gt(' + idx +')').val('');

});