解决Select下拉列表的高度

      Select 下拉列表的内容如果有很多的话，内容框的高度就会很高，导致不好看的。作者百度了查看了很多资料，也试过。可以通过css和js来进行高度的控制，但是不太好看。后来发现了通过combobox这个组件就可以解决这个问题了。

    一:引入js，css文件

       引入jquery.easyui.min.js,combobox-ext.css 这两个文件。

   

    二:在jsp页面编写以下代码

    <input class= "common-border" id="caseGroupSelect" style="width:300px;height:25px;" ></input> 
  

    三:在js文件里初始化组件   

   

 $("#caseGroupSelect").combobox({                      valueField : 'id',                      textField : 'name',                      editable : true,                      required : true,                      mode : 'local',                      data: rData,                    onSelect:function(record){                        $("#caseGroupSelect").val(record.id);                        //alert($("#caseGroupSelect").val())                      }                               });  

    data:这是一个对象集合。

    四:复写样式

    为什么要复写样式呢？因为每个系统都有自己的样式，默认的样式可能和你的系统不符合，通过复写样式，写成符合你系统的风格的样式?

   

/* combobox的样式 */.combo-arrow{    background: url(../../images/workbench/caseResource/combo_arrow_new.png) no-repeat center center;

}.combo-arrow{  background-color: #eee;}.combo-arrow:hover {    background-color: #e0e0e0;}.textbox{  border: 1px solid #ccc;}.panel-header, .panel-body{  border: 1px solid #ccc;}

  五:效果

  

 文件下载地址如下：

   http://download.csdn.net/detail/u013411856/9835121