jQuery - removeClass не работает, когда элемент имеет несколько классов - PullRequest
Новая
       48

jQuery - removeClass не работает, когда элемент имеет несколько классов

0 голосов
/ 04 июля 2019

Привет, у меня проблема с функцией removeClass(). Что мне нужно, так это то, что каждое действие по установке / снятию отметки с указанного элемента флажка должно в поле select ниже добавлять или удалять класс, определенный значением отмеченного флажка. К сожалению, это работает нормально только тогда, когда вы делаете щелчок поочередно в обоих флажках. Когда элемент option имеет несколько классов, и вы устанавливаете флажок, который был выбран ранее, классы не хотят быть удалены.

Спасибо за каждое объяснение этой проблемы и помощь в ее устранении.

HTML 

<span>
  <input class="checkbox" type="checkbox" value="1" > <label for="bahn_1">CB 1</label>
</span>
<span>
  <input class="checkbox" type="checkbox" value="2" > <label for="bahn_2">CB 2</label>
</span>

<select class="select" name="start_1" required>
  <option value="" selected disabled>Choose option</option>
  <option value="15:00">15:00</option>
  <option value="16:00">16:00</option>
  <option value="17:00">17:00</option>
</select>

JQuery 

<script>
$('.checkbox').click(function() {

  var thisVal = $(this).val();
  checked = $(this).is(":checked");

  if(checked) {

        $('select').find('option[value="16:00"]').addClass('class' + thisVal);

  } else {

    $("select").find("option[class^='class" + thisVal + "']").each(function(){

        $("select option[class^='class" + thisVal + "']").removeClass("class" + thisVal);

    });

  }
});
</script>

jsFiddle

https://jsfiddle.net/X9DESIGN/ahprcn03/16/

====

Я определенно использовал неправильную комбинацию функций и селекторов контента. Моя вина.

Решение с примером:

$("select").find("option[class^='class" + thisVal + "']")

неправильно, но

$("select option.class" + thisVal)

идеально.

...