根据数据库值在下拉列表项中添加不同的颜色答案

【问题标题】：Add different color in dropdownList Item from database values根据数据库值在下拉列表项中添加不同的颜色
【发布时间】：2013-06-13 16:04:45
【问题描述】：

我有一个下拉列表。这个下拉列表是从数据库绑定的

 @Html.DropDownListFor(m => m.AcademicAchievementColor, Model.BindRatings, "Select" })

AcademicAchievement 和 BindRatings 是我的模型属性

我在控制器中分配值

schoolPerformanceModel.BindRatings = new SelectList(performanceRepository.GetRatings(), "RatingId", "RatingName");

.数据库值是

1)Exceeds
2)Meets
3)Approaching
4)Does Not Meet

我使用 jquery 来改变颜色

见下文

<script type="text/javascript">
    (document).ready(function() {
        $('#AcademicAchievementColor option:Exceeds').css('background-color', '#Red');
        $('#AcademicAchievementColor option:Meets').css('background-color', 'Green');
        $('#AcademicAchievementColor option:Approaching').css('background-color', '#Yellow');
        $('#AcademicAchievementColor option:Does Not Meet').css('background-color', 'Blue');
    });
</script>

但是，它不起作用。你有什么想法吗？

【问题讨论】：

更正错字$(document).ready(..

标签： jquery model-view-controller drop-down-menu styles

【解决方案1】：

试试这个

$('#AcademicAchievementColor option[value=Exceeds]').css('background-color', 'red');

【讨论】：

除非您有一个 id="AcademicAchievementColor" 的选择，并且您在构建 DOM 之后调用您的脚本，否则它必须工作。您也可以通过 css #AcademicAchievementColor option[value=Exceeds] { background:red;}
是的，我知道我做对了。但它不起作用。如果我有任何脚本问题？
我有一个问题。如何在下拉菜单中设置禁用悬停？