<commit_before># 标签管理器

## 综合示例

<div class="example">
  <div class="tabs" id="tabsExample"></div>
</div>

```html
<div class="tabs" id="tabsExample"></div>
```

```js
// 定义标签页
var tabs = [{
    title: 'iframe 例子',
    url: 'docs/partial/iframe-tab.html',
    type: 'iframe',
    forbidClose: true
}, {
    title: 'Ajax 例子',
    url: 'docs/partial/remote-tab.html',
    type: 'ajax'
}, {
    title: '自定义例子',
    icon: 'icon-star',
    type: 'custom',
    content: function() {
        return '<div class="alert alert-block alert-success"><p>这里的内容是通过函数动态生成的，每次刷新下面的时间都会更新。</p><p>' + (new Date().format('yyyy-MM-dd hh:mm:ss')) +   '</p></div>';
    }
}, {
    title: 'MZUI',
    url: 'http://zui.sexy/m',
    type: 'iframe'
}, {
    defaultTitle: '无法加载的标签页',
    url: 'http://zui1.sexy'
}];

// 初始化标签页管理器
$('#tabs').tabs({tabs: tabs});
```

## 选项

<table class="table table-bordered">
  <thead>
    <tr>
      <th style="width: 140px">选项</th>
      <th style="width: 150px">名称</th>
      <th style="width: 150px">可用值</th>
      <th>说明</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><code>tabs</code></td>
      <td>初始标签页列表</td>
      <td>默认为 `[]`</td>
      <td>指定一个标签页对象数组用于定义在标签页管理器初始化后显示的标签页，标签页对象定义参加下文。</td>
    </tr>
    <tr>
      <td><code>defaultTab</code></td>
      <td>默认激活的标签页 ID</td>
      <td>默认为 `null`</td>
      <td>如果设置为空值（`null`）则会在标签页管理器初始化之后激活初始标签页列表中的第一个标签页。</td>
    </tr>
    <tr>
      <td><code>contextMenu</code></td>
      <td>是否启用上下文菜单</td>
      <td>默认为 `true`</td>
      <td>如果设置为 `true` 则在导航上启用上下文菜单方便用户操作标签页，当使用鼠标操作时，通常是点击鼠标右键显示一个菜单。</td><commit_msg> * fix example element id.<commit_after># 标签管理器

## 综合示例

<div class="example">
  <div class="tabs" id="tabsExample"></div>
</div>

```html
<div class="tabs" id="tabsExample"></div>
```

```js
// 定义标签页
var tabs = [{
    title: 'iframe 例子',
    url: 'docs/partial/iframe-tab.html',
    type: 'iframe',
    forbidClose: true
}, {
    title: 'Ajax 例子',
    url: 'docs/partial/remote-tab.html',
    type: 'ajax'
}, {
    title: '自定义例子',
    icon: 'icon-star',
    type: 'custom',
    content: function() {
        return '<div class="alert alert-block alert-success"><p>这里的内容是通过函数动态生成的，每次刷新下面的时间都会更新。</p><p>' + (new Date().format('yyyy-MM-dd hh:mm:ss')) +   '</p></div>';
    }
}, {
    title: 'MZUI',
    url: 'http://zui.sexy/m',
    type: 'iframe'
}, {
    defaultTitle: '无法加载的标签页',
    url: 'http://zui1.sexy'
}];

// 初始化标签页管理器
$('#tabsExample').tabs({tabs: tabs});
```

## 选项

<table class="table table-bordered">
  <thead>
    <tr>
      <th style="width: 140px">选项</th>
      <th style="width: 150px">名称</th>
      <th style="width: 150px">可用值</th>
      <th>说明</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><code>tabs</code></td>
      <td>初始标签页列表</td>
      <td>默认为 `[]`</td>
      <td>指定一个标签页对象数组用于定义在标签页管理器初始化后显示的标签页，标签页对象定义参加下文。</td>
    </tr>
    <tr>
      <td><code>defaultTab</code></td>
      <td>默认激活的标签页 ID</td>
      <td>默认为 `null`</td>
      <td>如果设置为空值（`null`）则会在标签页管理器初始化之后激活初始标签页列表中的第一个标签页。</td>
    </tr>
    <tr>
      <td><code>contextMenu</code></td>
      <td>是否启用上下文菜单</td>
      <td>默认为 `true`</td>
      <td>如果设置为 `true` 则在导航上启用上下文菜单方便用户操作标签页，当使用鼠标操作时，通常是点击鼠标右键显示一个菜单。</td>
{'fraction_non_alphanumeric': 0.22625, 'fraction_numerical': 0.00625, 'mean_word_length': 2.9863013698630136, 'pattern_counts': {'":': 0, '<': 125, '<?xml version=': 0, '>': 125, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '199273', 'n_tokens_mistral': 1651, 'n_tokens_neox': 1754, 'n_words': 213}