Не могли бы вы помочь мне со следующим:

Мой код:

<select name="genform[praeferenz_1]" id="genform_praeferenz_1">
<option value="placeholder_1">Bitte wählen...</option>
<option value="rot_1">Rot</option>
<option value="weiss_1">Weiß</option>
<option value="gelb_1">Gelb</option>
<option value="blau_1">Blau</option>
</select><

<select name="genform[praeferenz_2]" id="genform_praeferenz_2">
<option value="placeholder_2">Bitte wählen...</option>
<option value="rot_2">Rot</option>
<option value="weiss_2">Weiß</option>
<option value="gelb_2">Gelb</option>
<option value="blau_2">Blau</option>
</select>

<select name="genform[praeferenz_3]" id="genform_praeferenz_3">
<option value="palceholder_3">Bitte Trikotfarbe wählen...</option>
<option value="rot_3">Rot</option>
<option value="weiss_3">Weiß</option>
<option value="gelb_3">Gelb</option>
<option value="blau_3">Blau</option>
</select>

<select name="genform[praeferenz_4]" id="genform_praeferenz_4">
<option value="placeholder_4">Bitte wählen...</option>
<option value="rot_4">Rot</option>
<option value="weiss_4">Weiß</option>
<option value="gelb_4">Gelb</option>
<option value="blau_4">Blau</option>
</select>

Если вы выбрали один из вариантов, остальные варианты следует удалить.

Примере:

Если я выберу «rot_1» в первом раскрывающемся списке, тогда rot_2, rot_3, rot_4 будут недоступны в следующих раскрывающихся списках.

Затем, когда я выбираю gelb_2 во втором выпадающем меню.

В следующих раскрывающихся списках gelb_3 и gelb_4 больше не доступны.

И так далее....

-2
Fredi Karschuk 25 Апр 2018 в 11:50

1 ответ

Лучший ответ

Пожалуйста, найдите следующий фрагмент в соответствии с вашими требованиями.

$(document).ready(function() {
  $(document).on("change", "select", function() {
    var cur_id = $(this).attr("id");
    var cur_val = $(this).val();
    if (typeof cur_val != 'undefined' && cur_val != '') {
      subs = cur_val.substr(0, cur_val.indexOf('_'));
      $("select[id!='" + cur_id + "']").each(function() {
        $(this).find("option").each(function() {
          //$(this).show();
          var cur_v = $(this).val();
          subst = cur_v.substr(0, cur_v.indexOf('_'));
          if (subs == subst) {
            $(this).hide();
          }
        });
      });
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="genform[praeferenz_1]" id="genform_praeferenz_1">
  <option value="placeholder_1">Bitte wählen...</option>
  <option value="rot_1">Rot</option>
  <option value="weiss_1">Weiß</option>
  <option value="gelb_1">Gelb</option>
  <option value="blau_1">Blau</option>
</select>

<select name="genform[praeferenz_2]" id="genform_praeferenz_2">
  <option value="placeholder_2">Bitte wählen...</option>
  <option value="rot_2">Rot</option>
  <option value="weiss_2">Weiß</option>
  <option value="gelb_2">Gelb</option>
  <option value="blau_2">Blau</option>
</select>

<select name="genform[praeferenz_3]" id="genform_praeferenz_3">
  <option value="palceholder_3">Bitte Trikotfarbe wählen...</option>
  <option value="rot_3">Rot</option>
  <option value="weiss_3">Weiß</option>
  <option value="gelb_3">Gelb</option>
  <option value="blau_3">Blau</option>
</select>

<select name="genform[praeferenz_4]" id="genform_praeferenz_4">
  <option value="placeholder_4">Bitte wählen...</option>
  <option value="rot_4">Rot</option>
  <option value="weiss_4">Weiß</option>
  <option value="gelb_4">Gelb</option>
  <option value="blau_4">Blau</option>
</select>

Метод substr () возвращает часть строки между начальным индексом и количеством символов после него.

Метод indexOf () возвращает индекс в вызывающем объекте String первого вхождения указанного значения, начиная поиск с fromIndex. Возвращает -1, если значение не найдено.

1
Rahul 25 Апр 2018 в 09:22