jquery - 在 JQuery 中设置选择选项的背景颜色

Question

我有一个包含多个选择框的页面，如下所示:

<select name="item-0-status" id="id_item-0-status">
<option value="">---------</option>
<option value="1">Online</option>
<option value="2">Offline</option>
<option value="3">Unknown</option>
</select>

这些是在 django 中自动生成的，因此不可能将 css 类、id 或属性直接应用于选项。选择元素的 ID 为“item-0-status”、“item-1-status”、“item-2-status”等。

如何使用 select 元素的 id 将 css 颜色添加到选项？

我试着按照这里的代码:How do you select a particular option in a SELECT element in jQuery?

这引导我去做，例如以下用于将“离线”选项设置为红色:

$('select[id$=-status][id^=id_item-]').children().find('option[value="2"]').css('background-color','#FF0000');

但这没有效果。

我怎样才能使这项工作？我知道浏览器对此的支持有所不同，但这不是问题。对于这个问题，在 Firefox 3.6 中工作就足够了。

Answer 1

虽然我不太确定，但类似的东西应该可以工作。

$(function(){   

$('#id_item-0-status').children().each(
        function (){
            if($(this).val() == 2){
                $(this).css({'background':'red'});
            }
        }
);

})