我有很多选择相同的类,如何更改选择的颜色?
如果选择的选项=首先,则选择的background-color
应该是red
;如果选择的选项=第二,则应该是green
。
<select class="select">
<option value="first" selected>first</option>
<option value="second">second</option>
</select>
<select class="select">
<option value="first">first</option>
<option value="second" selected>second</option>
</select>
答案 0 :(得分:0)
我有很多选择相同的课程
您可以使用此公共类附加更改事件,然后使用this
关键字来知道更改了哪个选择,例如:
$('.select').on('change', function() {
var selected_value = $(this).val();
var color = "";
if (selected_value === 'first') {
color = 'red';
} else if (selected_value === 'second') {
color = 'green';
}
$(this).css('background-color', color);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="select">
<option value=""></option>
<option value="first">first</option>
<option value="second">second</option>
</select>
<select class="select">
<option value=""></option>
<option value="first">first</option>
<option value="second">second</option>
</select>