jQuery-当元素具有多个类时,removeClass不起作用

时间:2019-07-04 19:47:24

标签: javascript jquery checkbox input click

嗨,我对removeClass()函数有疑问。 我需要的是对指定复选框元素的每个检查/取消选中操作都应在下面的select字段中,添加或删除由clicked复选框的值定义的类。不幸的是,只有当您同时在两个复选框中都执行点击操作时,此方法才有效。当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)

很完美。

0 个答案:

没有答案