Hi I have problem with removeClass() function. What I need is every check/uncheck action on specified checkbox element should in select field below, add or remove class defined by the value of clicked checkbox. Unfortunately this works fine only when you make click action alternately at both checkboxes. When option element have multiple classes and you click same checkbox which you have previously clicked, classes do not want to be removed.
Thank You for every explanation of this issue and help to fix it.
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/
Aucun commentaire:
Enregistrer un commentaire