$.createselect=function(Options) {$ (options.selectors). each (function(Index, item) {$ (item). each (function(index, selector) {if($ (selector). Is (' SELECT ')){ varOptionlength = $ ( This). Find (' option '). length; if(Optionlength > 0){ varDivclass = $ ( This). attr (' class '); varJsscroll = ' <div class= ' ' +divclass+ ' selector ' ><span> ' +$ ( This). Find (' option '). EQ (0). Text () + ' </span><ul> '; for(vari = 0; i < optionlength; i++){ var$op = $ ( This). Find ("option"). EQ (i); Jsscroll+ = "<li val=" + $op. attr ("value") + ">" + $op. HTML () + "</li>\n"; } jsscroll+ = ' </ul></div> '; $( This). After (Jsscroll); $( This). Hide (); var$divW = $ ('. ') +divclass). Outerwidth (); $(‘.‘ +divclass). Find (' span '). CSS ({' width ': $divW-5}). On (' click ',function(){ $( This). Next (' UL '). Show (); }). End (). Find (' ul '). css ({' Width ': $divW}). Find (' Li '). On ({' MouseOver ':function(){$( This). addclass (' cur ')}, ' Mouseout ':function(){$( This). Removeclass (' cur ')}, ' Click ':function(){ $( This). Closest (' ul '). Hide (). Siblings (' span '). Text ($ ( This). text ()); } }); }}) ({}$.createselect }})})' Selectors ': ['. Selector1 ']})
. Selector{Border:1px solid #ccc;position:relative;}. Selector span{Padding-left:5px;background:URL (icon.png) no-repeat 265px-19px;Display:Inline-block;width:100%;Height:100%;cursor:Pointer;}. Selector ul{position:Absolute;Top:31px; Left:-1px;width:300px;Border:1px solid #ccc;Display:None;}. selector ul Li{Height:25px;Line-height:25px;Padding-left:5px;cursor:Pointer;}. Selector ul li.cur{background:#eee;}
A select plugin written by
is coarse; modify it slowly