Kendo UI 下拉列表 - 每个列表项的背景颜色不同答案

【问题标题】：Kendo UI dropdown list - different background color to each list itemKendo UI 下拉列表 - 每个列表项的背景颜色不同
【发布时间】：2014-04-14 09:05:10
【问题描述】：

如何为 Kendo UI 下拉列表中的每个列表项（未选中）提供不同的背景颜色，而不是为整个下拉列表提供通用的背景颜色？

【问题讨论】：

标签： kendo-ui kendo-dropdown

【解决方案1】：

您应该定义一个设置适当颜色的模板。

例子：

将数据源定义为：

var colors = [
    "red",
    "green",
    "pink",
    "blue",
    "yellow"
];

还有一个模板为：

<script id="template" type="text/kendo-script">
    <div style="background-color: #= data #">#= data #</div>
</script>

那么你的下拉列表定义应该是：

var template = kendo.template($("#template").html())
$("#dropdownlist").kendoDropDownList({
    dataSource: colors,
    template : template
});

这里的工作示例：http://jsfiddle.net/OnaBai/MzLrS/

【讨论】：

使用同一个jsFiddle，有没有办法让选中项的背景颜色发生变化？
你救了我的命。我有一个类 bg-somecolor 并且我的项目有颜色值 somecolor .. 我只能做背景颜色：“bg-#：颜色#”