如何在selectmenu中设置个别样式（css）选项（jquery-ui：selectmenu） [英] how set individual styles (css) for option in selectmenu (jquery-ui: selectmenu)

问题描述

我有一个html表单：select

 < select id ='myselect'> 
< option value ='1'> 1< / option> 
< option value ='2'> 2< / option> 
 ... 
< option value ='N'> N< / option> 
< / select> 
  

用于绘制美丽的图画我使用jquery-ui

  $（ '＃myselect'）selectmenu（）; 
  

我需要box 1有自己的风格

怎么做？设置ID，类不起作用：（$ / b>

我认为我应该做以下事情：

1 ）创建html代码的'经典'选择表单

2）加入创建'经典'选择表单到jquery-ui

3）在jquery-ui selectmenu中找到元素（HOW？）

4）设置为找到的元素new class-name

5）使用css作为class-name

解决方案

Twisty，非常感谢创意方向

决定：

  $。widget（ui.selectmenu，$ .ui .selectmenu {
 _my_render：function（item）{
 return $（< div+（（item.element [0] .attributes.my_level == undefined）？（）： （class ='_my_class'））+>+ item.label +< / div>）; 
}，
 
 _renderItem：function（ul，item ）{
 
 return $（< li>）
 .append（this._my_render（item））
 .appendTo（ul）; 
}，
}）; 
  

I have a html form:select

<select id = 'myselect'>
<option value = '1'>1</option>
<option value = '2'>2</option>
...
<option value = 'N'>N</option>
</select>

for a beautiful drawing I use jquery-ui

$('#myselect').selectmenu();

I need to box 1 had its own style

how to do it? set the id, class does not work :(

I think that i should do the following:

1) create html code of 'classic' select form

2) join created 'classic' select form to jquery-ui

3) find element in jquery-ui selectmenu (HOW?)

4) set to found element new class-name

5) use css for class-name

解决方案

Twisty, big thanks for idea's direction

decision:

$.widget( "ui.selectmenu", $.ui.selectmenu, {
    _my_render: function( item ) {          
        return $("<div" + ((item.element[0].attributes.my_level == undefined) ? ("") : (" class = '_my_class'")) + ">" + item.label + "</div>");
    },

    _renderItem: function( ul, item ) {

        return $( "<li>" )
            .append(this._my_render(item))
            .appendTo(ul);
    },
});

这篇关于如何在selectmenu中设置个别样式（css）选项（jquery-ui：selectmenu）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！