CSS

/* select */
.sel_wrap{width:210px;height:26px;background:#fafafa url(img/1001v1430205172991723649_b.png) no-repeat 173px -27px;border:1px solid #ccc;border-radius:0px;cursor:pointer;position:relative;_filter:alpha(opacity=0);padding: 0px 3px 0px 3px;}
.sel_wrap span{line-height:26px;padding-left:10px;font-size:13px;z-index:2;}
.sel_wrap .select{width:210px;height:28px;z-index:4;position:absolute;top:0;left:0;margin:0;padding:0;opacity:0;cursor:pointer;}

JQuery

// select 重定义下拉框
$(function(){
 $(".sel_wrap").change(function() {

  var o;
  var opt = $(this).find('option');

  opt.each(function(i) {
   if (opt[i].selected == true) {
    o = opt[i][removed];
  }
  })
  $(this).find('span').html(o);
 }).trigger('change');
});

HTML

<div class="sel_wrap">
  <span>请从下面选择</span>
  <select name="group" class="select">
    <option value="1">jquery</option>
    <option value="2">css</option>
    <option value="3">html</option>
  </select>
</div>

效果:

评论

您还没有登陆,登陆后可以发表评论哦!点击登陆