我正在使用 Select2 在我的应用程序中设置多选标记类型字段。我知道哪个 CSS 属性一旦被放置在选择字段中就会改变选择框的颜色:
选择框颜色
.select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px
}
我想弄清楚的是如何根据用户所做的选择进行此更改。选择列表是预定义的。
尝试过这样的事情:
用于初始化/更改框颜色的 JavaScript
$(document).ready(function () {
$('#test').select2();
$('.select2-container--default .select2-selection--multiple .select2-selection__choice').each(function () {
var title = $(this).attr('title');
console.log(title);
if (title === 'Breakfast') {
$(this).parent().css({ 'background-color': "green" });
}
if (title === 'Brunch') {
$(this).parent().css({ 'background-color': "red" });
}
if (title === 'Lunch') {
$(this).parent().css({ 'background-color': "blue" });
}
});
});
这似乎不起作用。有没有人试过为 Select2 设置标签框的样式?
最佳答案
更改$(this).parent().css('background-color', 'green');
通过 $(this).parent().css({ 'background-color': "green"});
其他的也一样。
关于javascript - 更改选择字段中 select2 选择的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45946496/