Удаление всех опций окна выбора, кроме 1-го варианта

Я пытаюсь очистить опции выбора, когда:

id "mClick" выбран, id "sClick", "cClick" и "srClick" будут опущены.

id "sClick" выбран, id "cClick" и "srClick" будут опущены.

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>

в сценарии 3, я использовал эту функцию, но удалил все, кроме последнего выбора. Любая идея, что мне не хватает? Благодаря

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

Ответы

Ответ 1

Самый простой способ очистить параметры в том, как вы описываете, - это использовать 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;
    }
  }
});

Демо

Я не уверен, как вы собираетесь заселять выпадающие списки:)

Ответ 2

Попробуйте это

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

Ответ 3

вы можете использовать селектор :gt() для jQuery для этого

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

Это приведет к удалению всех параметров, которые больше 0

Ответ 4

Вы можете использовать not(:first)

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

Ответ 5

Работает

$('#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();
});

Ответ 6

Попробуйте это

$('#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('');

});

Ответ 7

сопоставить общий класс с раскрывающимся списком, затем

$('. general option [значение!= ""]'). remove();

это приведет к удалению всех параметров, кроме первого, значение которого пустое Надеюсь, это поможет