构建 TabControl 类的新实例。
| 全称 | mx.containers.TabControl |
| 命名空间 | mx.containers |
| 类 | TabControl |
| 继承层次结构 | TabControlContainerControl |
| 源文件 | ~\mx\scripts\containers\TabControl.js |
提供一个分页控件。
示例 1
以下是一个创建 TabControl 的示例。
该示例将说明如何创建一个 TabControl，如何添加 TabPage 页，以及如何订购事件。
| JavaScript 代码 |
var tabControl = new mx.containers.TabControl({
pages:[
{ text: "常规", name: "general" },
{ text: "角色", name: "role" }
],
onselectionchanging: _selection_changing,
onselectionchanged: _selection_changed
});
function _selection_changing(e)
{
if (!confirm("确定需要更改选择项?"))
{
e.cancel = true;
}
}
function _selection_changed()
{
alert("选择页发生了改变，当前选择项为：" + tabControl.selection.text);
} |
构造函数
| 名称 | 说明 |
| TabControl() | 构建 TabControl 类的新实例。 |
初始化函数
| 名称 | 说明 |
| init() | 初始化方法。执行设置样式并初始化属性等操作。 |
方法
字段
| 名称 | 说明 |
| alias | 获取或设置一个字符串，表示控件的别名。 |
| border | 获取控件的边框样式。如“1px solid red”，表示边框的样式为 1 像素红色的实线。请使用 setBorder 方法设置该字段的值。 |
| bottom | 获取控件的下边界与父容器下边界的像素距离。请使用 setBottom 方法设置该字段的值。 |
| contextMenu | 获取或设置容器的上下文菜单。 |
| controls | 获取容器包含的控件集合。集合中的单个控件也可能是一个容器。请使用 addControl 和 removeControl 方法向集合中添加或移除控件。 |
| cssClass | 指定css伪类名称，设置控件显示样式 |
| display | 获取控件的显示样式值。如“none”，表示隐藏控件； “block”表示强制作为块对象呈递。请使用 setDisplay。注：该"block"值不能在ComplexGrid控件中使用。 方法设置该字段的值。 |
| displayIcon | 获取或设置一个Boolean值，该值表示是否显示标签图标。 |
| enabled | 获取控件是否可以对用户交互作出响应。如果该值为 true，则表示控件可以对用户交互作出响应；反之则不能。 请使用 setEnabled 方法设置该字段的值。 |
| eTag | 获取控件的标签。 |
| headerVisible | 获取或设置一个 Boolean 值，该值表示是否显示控件的分页按钮。 该字段必须在初始化前设置。控件初始化后请使用 setHeaderVisible 方法设置该字段的值。 |
| height | 获取容器的高度。可以是数字（如 500）、字符串（如“500px”或“50%”）。 |
| layout | 获取和设置一个容器控件的布局器。详见 LayoutFactoryClass.createLayout 方法的 p_layout参数。 |
| layoutConfigs | 获取或者设置一个 JSON 对象，该属性表示控件在父容器中的布局配置参数。该属性只有在控件父容器运用布局器才会生效。 |
| layoutOptions | 获取和设置布局参数，该属性是一个 JSON 对象。 |
| left | 获取控件的左边界与父容器左边界的像素距离。请使用 setLeft 方法设置该字段的值。 |
| padding | 获取控件的内边距。如“4px”表示上下左右的内边距均为 4 像素； “4px 2px 3px 1px”则表示上边距为 4 像素，右边距为 2 像素，下边距为 3 像素，左边距为 1 像素。请使用 setPadding 方法设置该字段的值。 |
| pages | 获取一个集合，包含控件中所有的页（TabPage 类型）。 |
| parent | 获取控件所属的父对象。 |
| permissionID | 获取或设置一个字符串，表示控件的权限标识。 |
| position | 详见 Control.position 属性。 |
| right | 获取控件的右边界与父容器右边界的像素距离。请使用 setRight 方法设置该字段的值。 |
| selection | 获取一个对象，表示 TabControl 中当前显示的页（TabPage 类型）。 |
| top | 获取控件的上边界与父容器上边界的像素距离。请使用 setTop 方法设置该字段的值。 |
| visible | 获取一个 Boolean 值，表示控件是否可见。如果该值为 true，则表示控件可见；反之则不可见。请使用 setVisible 方法设置该字段的值。 |
| width | 获取容器的宽度。可以是数字（如 500）、字符串（如“500px”或“50%”）。 |
| $body | 获取一个 JQuery 对象，该对象用于显示每页的内容。 |
| $container | 获取容器控件中用来包含控件 DOM 元素的占位符。 |
| $e | 获取该控件的占位符，该占位符为一个 JQuery 对象。 |
| $head | 获取一个 JQuery 对象，该对象用于显示分页按钮。 |
| $left_scroll_div |
事件
| 名称 | 说明 |
| onctrladded | 当添加控件到容器后，将触发该事件。 |
| onctrlremoved | 当从容器移除控件后，将触发该事件。 |
| onselectionchanged | 当控件的显示页发生改变后，将触发该事件。调用 selectPage(p_page, true) 方法后会触发该事件。 |
| onselectionchanging | 当控件的显示页发生改变的时候，将触发该事件。调用 selectPage 方法时会触发该事件。 |
方法详细信息
addControl(p_control, p_islinebreak) 方法
append($p_obj) 方法
向容器中添加内容。
参数
- $p_obj一个 JQuery 对象，或一个控件（包含 $container 容器），或一个 HTML DOM 元素。
继承自
appendPage(p_page) 方法
参数
- p_page一个 JSON 对象或一个 TabPage 对象，表示要添加的新页。
示例 1
以下是为 TabControl 添加一个 TabPage 的示例。
| JavaScript 代码 |
tabControl.appendPage("职位", "job"); // tabControl 为一个 TabControl 实例对象，“职位”为 TabPage 的“text”属性值，“job”为 TabPage 的“name”属性值 |
appendPage(p_name, p_text, p_closable) 方法
参数
- p_name一个字符串（不能是全为数字的字符串，必须包含一个非数字字符），表示该页的名称。TabPage.name 字段也是所有页的唯一标识，必须唯一。
- p_text一个字符串，表示该页的按钮上显示的文本。
- p_closable一个Boolean值，表示该页是否可以关闭。
示例 1
以下是为 TabControl 添加一个 TabPage 的示例。
| JavaScript 代码 |
tabControl.appendPage("职位", "job"); // tabControl 为一个 TabControl 实例对象，“职位”为 TabPage 的“text”属性值，“job”为 TabPage 的“name”属性值 |
appendPages(p_pages) 方法
向 TabControl 的页集合（pages 集合）中添加一组页。
参数
- p_pages一个数组，该数组包含了一组 TabPage 对象。
示例 1
以下是为 TabControl 添加一组 TabPage 的示例。
| JavaScript 代码 |
tabControl.appendPages([
{ text: "职位", name: "job", closable: true},
{ text: "岗位", name: "position", imageKey: "position_16" }
]); |
contains($p_target) 方法
返回一个 Boolean 值，该值表示控件的容器中是否包含该 JQuery 对象。
参数
- $p_target一个 JQuery 对象，或 JQuery 选择器对应的字符串（如“#container”），或 HTML DOM 元素。
继承自
findControlByPermissionID(p_permissionID) 方法
根据指定的权限标识查找当前视图中对应的控件。
参数
- p_permissionID一个字符串，表示控件的权限标识。
继承自
moveTo(p_left, p_top) 方法
移动控件到指定位置。
参数
- p_left一个数字，表示 css 样式的 left 属性。
- p_top一个数字，表示 css 样式的 top 属性。
继承自
removePage(p_page) 方法
从 pages 集合中移除指定的 TabPage 对象，若该页是控件当前的显示页，则会自动选择第一页，并触发 onselectionchanged 事件。从集合中移除页时，有关移除的页的所有信息均会被删除。
参数
- p_page
resizeTo(p_width, p_height) 方法
重设控件的大小。
参数
- p_width控件的宽度，可以是数字（如 100），也可以是字符串（如 “100%”）。
- p_height控件的高度，可以是数字（如 100），也可以是字符串（如 “100%”）。
继承自
selectPage(p_page, [p_triggerEvent]) 方法
选择并显示 TabControl 页集合中的指定页。
参数
- p_page
- p_triggerEvent可选的。默认值为“false”。一个 Boolean 值，表示是否要触发 onselectionchanged 事件。如果该值为 true，则触发事件；反之则不触发。
setBorder(p_border) 方法
setBottom(p_bottom) 方法
setCssClass(p_cssClass) 方法
setDisplay(p_display) 方法
setHeaderVisible([p_headerVisible]) 方法
设置 headerVisible 字段的值。
参数
- p_headerVisible可选的。默认值为“true”。一个 Boolean 值，表示是否显示控件的分页按钮。如果该值为 true，表示显示分页按钮；反之则不显示。
setHeight(p_height) 方法
setPadding(p_padding) 方法
setPosition(p_position) 方法
setTop(p_top) 方法
setVisible(p_visible) 方法
setWidth(p_width) 方法
$wrap([p_obj]) 方法
返回一个 JQuery 对象。
参数
- p_obj可选的。默认值为“me.$e”。一个 JQuery 对象，或继承自 Control 的控件，或字符串，或 HTML DOM 元素。如果参数为 JQuery 对象，则返回本身；如果参数为继承自 Control 的控件，则返回控件的 $e 对象；如果参数为字符串，则返回以字符串为选择器的 JQuery 对象；如果参数为空，则返回控件本身的 $e 对象。
继承自
字段详细信息
controls 字段
获取容器包含的控件集合。集合中的单个控件也可能是一个容器。请使用 addControl 和
removeControl 方法向集合中添加或移除控件。
继承自
集合
该字段是一个集合数组字段。
集合中成员的类型为
mx.controls.Control。
集合索引
控件在集合中的序号（从 0 开始计数）。
display 字段
获取控件的显示样式值。如“none”，表示隐藏控件；
“block”表示强制作为块对象呈递。请使用 setDisplay。注：该"block"值不能在ComplexGrid控件中使用。
方法设置该字段的值。
继承自
displayIcon 字段
获取或设置一个Boolean值，该值表示是否显示标签图标。
默认值
false
enabled 字段
headerVisible 字段
layoutConfigs 字段
padding 字段
获取控件的内边距。如“4px”表示上下左右的内边距均为 4 像素； “4px 2px 3px 1px”则表示上边距为 4 像素，右边距为 2
像素，下边距为 3 像素，左边距为 1 像素。请使用 setPadding 方法设置该字段的值。
继承自
pages 字段
获取一个集合，包含控件中所有的页（TabPage 类型）。
集合
该字段是一个集合数组字段。
集合中成员的类型为
mx.containers.TabPage。
集合索引
页的名称（TabPage.name）或页在集合中的序号（从 0 开始计数）。
$body 字段
获取一个 JQuery 对象，该对象用于显示每页的内容。
$head 字段
获取一个 JQuery 对象，该对象用于显示分页按钮。
$left_scroll_div 字段
事件详细信息
onctrladded 事件
onctrlremoved 事件
onselectionchanged 事件
onselectionchanging 事件
当控件的显示页发生改变的时候，将触发该事件。调用 selectPage 方法时会触发该事件。
参数
- cancel可通过设置 cancel 参数为 true 来取消当前操作。默认为 false。
- page一个 TabPage 对象，即将被选择并显示的选项卡页。