样式部分的OPTION文本

我有一个包含多个OPTION元素的SELECT列表.这是我对选项文本的一部分样式的天真方法:

red SLOW
blue SLOWER
green SLOWEST

这不起作用:浏览器不喜欢OPTION元素中的SPAN元素.

是否有其他方式来设置OPTION元素文本的一部分？

但您始终可以创建自定义选择框.请参考下面的jsFiddle,

JSFiddle用于多种颜色的选择框选项

// Insert a list item into the unordered list for each select option
for (var i = 0; i < numberOfOptions; i++) {
    $('
', {
        html: $this.children('option').eq(i).text()
        .split(' ').join(' '),
            rel: $this.children('option').eq(i).val()
    }).appendTo($list);
}

不.options以平台原生的方式设计样式,仅仅样式的一部分样式不起作用.(通常也不是特别好的主意.)

或者你可以使用Bootstrap Drop Downs和几行Javascript来实现.

这是Bootstrap示例,稍加改动,加上'lil Javascript:

$(function() {
   $('#my-select').find('li').click(function() {
      $('#selected').html($(this).html());
   });
});

      
    
    




  
    Action 
  
  

    
Action like Super Man
    
Another action
    
Something else here
    

    
Separated link