### Combo（自定义下拉框） 扩展自$.fn.validatebox.defaults。使用$.fn.combo.defaults重写默认值对象。 自定义下拉框显示一个可编辑的文本框和下拉面板在html页面。这是构建其他复杂的组合部件（如：combobox,combotree,combogrid等）之前需要构建的最基本的组件。  ####   #### 依赖关系 - [textbox](#) - [panel](#) ####   #### 用法 自定义下拉框使用Javascript创建一个<select>或<input>元素。**注意：使用自定义下拉框不能通过标签的方式进行创建。** 1. **<input** id="cc" value="001"**>**   <input id="cc" value="001"> 1. $('#cc').combo({    1.     required:true,    1.     multiple:true   1. });   $('#cc').combo({ required:true, multiple:true }); ####   #### 属性 属性扩展自[validatebox](#)(验证框)，自定义下拉框新增的属性如下。 | **属性名** | **属性值类型** | **描述** | **默认值** | |-----|-----|-----|-----| | width | number | 组件的宽度。 | auto | | height | number | 组件的高度。**（该属性自1.3.2版开始可用）** | 22 | | panelWidth | number | 下拉面板宽度。 | null | | panelHeight | number | 下拉面板高度。 | 200 | | panelMinWidth | number | 下拉面板最小宽度。**（该属性自1.4版开始可用）** | null | | panelMaxWidth | number | 下拉面板最大宽度。**（该属性自1.4版开始可用）** | null | | panelMinHeight | number | 下拉面板最小高度。**（该属性自1.4版开始可用）** | null | | panelMaxHeight | number | 下拉面板最大高度。**（该属性自1.4版开始可用）** | null | | panelAlign | string | 面板对齐方式。可用值有：'left','right'。**（该属性自1.3.6版开始可用）** | 200 | | multiple | boolean | 定义是否支持多选。 | false | | selectOnNavigation | boolean | 定义是否允许使用键盘导航来选择项目。**（该属性自1.3.3版开始可用）** | true | | separator | string | 在多选的时候使用何种分隔符进行分割。 | , | | editable | boolean | 定义用户是否可以直接输入文本到字段中。 | true | | disabled | boolean | 设置启用/禁用字段。 | false | | readonly | boolean | 设置该字段为读写/只读模式。**（该属性自1.3.3版开始可用）** | false | | hasDownArrow | boolean | 定义是否显示向下箭头按钮。 | true | | value | string | 字段的默认值。 | | | delay | number | 最后一次输入事件与执行搜索之间的延迟间隔（执行自动完成功能的延迟间隔） | 200 | | keyHandler | object | 在用户按下键的时候调用一个函数。该按键处理器被定义为： ~~~ keyHandler: { up: function(){}, down: function(){}, enter: function(){}, query: function(q){} } ~~~ | | #### 事件 | **事件名** | **事件属性** | **描述** | |-----|-----|-----| | onShowPanel | none | 当下拉面板显示的时候触发。 | | onHidePanel | none | 当下拉面板隐藏的时候触发。 | | onChange | newValue, oldValue | 当字段值改变的时候触发。 | #### 方法 自定义下拉框的方法扩展自[validatebox](#)(验证框)。自定义下拉框新增的方法如下： <table class="doc-table"><tbody><tr><th><strong>方法名</strong></th> <th><strong>方法参数</strong></th> <th><strong>描述</strong></th></tr><tr><td>options</td> <td>none</td> <td>返回属性对象。</td></tr><tr><td>panel</td> <td>none</td> <td>返回下拉面板对象。</td></tr><tr><td>textbox</td> <td>none</td> <td>返回文本框对象。</td></tr><tr><td>destroy</td> <td>none</td> <td>销毁该组件。</td></tr><tr><td>resize</td> <td>width</td> <td>调整组件宽度。</td></tr><tr><td>showPanel</td> <td>none</td> <td>显示下拉面板。</td></tr><tr><td>hidePanel</td> <td>none</td> <td>隐藏下拉面板。</td></tr><tr><td>disable</td> <td>none</td> <td>禁用组件。</td></tr><tr><td>enable</td> <td>none</td> <td>启用组件。</td></tr><tr><td>readonly</td> <td>mode</td> <td>启用/禁用只读模式。<strong><font color="#ff0000">（该方法自1.3.3版开始可用）</font></strong><br/><p>使用案例：</p><pre>$('#cc').combo('readonly'); // 启用只读模式&#13; $('#cc').combo('readonly', true); // 启用只读模式&#13; $('#cc').combo('readonly', false); // 禁用只读模式</pre></td></tr><tr><td>validate</td> <td>none</td> <td>验证输入的值。</td></tr><tr><td>isValid</td> <td>none</td> <td>返回验证结果。</td></tr><tr><td>clear</td> <td>none</td> <td>清除控件的值。</td></tr><tr><td>reset</td> <td>none</td> <td>重置控件的值。<strong><font color="#ff0000">（该方法自1.3.2版开始可用）</font></strong></td></tr><tr><td>getText</td> <td>none</td> <td>获取输入的文本。</td></tr><tr><td>setText</td> <td>text</td> <td>设置输入的文本。</td></tr><tr><td>getValues</td> <td>none</td> <td>获取组件值的数组。</td></tr><tr><td>setValues</td> <td>values</td> <td>设置组件值的数组。</td></tr><tr><td>getValue</td> <td>none</td> <td>获取组件的值。</td></tr><tr><td>setValue</td> <td>value</td> <td>设置组件的值。</td></tr></tbody></table>