模板:Zhedie

此模板用于展示Widget:Zhedie的使用。

用于分开定义多个按钮和内容。按钮可以同时切换同一分组所有内容的显示、隐藏状态。

模板zhedie语法：

{{zhedie| 组 = 分组 | 按钮 = 按钮文本 }}
{{zhedie| 组 = 分组 | 内容 = 要切换显示的内容 }}

参数：

按钮：按钮上显示的文本
内容/行内内容：要切换显示的内容
组（必填）：指定分组，用来关联按钮与内容
class（可选）：便于自定义分组样式
active（可选）：让内容默认显示，即为元素增加.zhedie-active类。对按钮也有效。

示例：

{{zhedie|组=武器信息|按钮=点击233（组1）|内容=
* 123
* 123
* 123
}}

{{zhedie|组=披挂信息|按钮=按钮（组2）|class=btn btn-default}}<!-- 另一个按钮 -->{{zhedie|组=披挂信息|按钮=状态相反的按钮（组2）|class=btn btn-default|active=1}}
{{zhedie|组=披挂信息|内容=
* 1232222
* 1232222
* 1232222
}}


{{zhedie| 组 = 武器信息 | 按钮 = 点击233（组1）}}{{组| group = 武器信息 | 行内内容 = 行内显示 行内显示 行内显示 行内显示}}

点击233（组1）

123
123
123

自定义Class按钮（组2）状态相反的按钮（组2）

1232222
1232222
1232222

点击233（组1）行内显示行内显示行内显示行内显示

目标HTML示例

Widget:Zhedie 被设计用于支持这种格式的HTML：

<p class="zhedie-button" data-zhedie="分组名1" tabindex="0">按钮显示文本</p>
<div class="zhedie-content zhedie-hidden" data-zhedie="分组名1">
内容
</div>

<div class="zhedie-button" data-zhedie="分组名2" tabindex="0">按钮显示文本</div>
<p class="zhedie-content zhedie-active" data-zhedie="分组名2">
内容
</p>

所有 .zhedie-button 被视为控制按钮。所有 .zhedie-content 被视为内容

.zhedie-hidden 用于隐藏（display:none） .zhedie-active 用于标记显示（没有自带的css）

详见Widget:Zhedie说明。