三级联动效果-Axure

一起来探讨下三级联动的效果吧！

今天要做的效果是：选择一级菜单，二级菜单联动；选择二级菜单或二级菜单选项改变，三级菜单联动。

最终效果示例图

各级菜单的内容及关联如下图所示：

联动关系图

制作步骤如下：

1.首先建立三级菜单：

（1）一级菜单选项内容：植物、动物

（2）二级菜单选项内容：一级菜单选择植物，选项内容花、草；一级菜单选择动物，选项内容鸟、鱼。

所以建立一个动态面板（命名：生物），两个状态。

状态一命名植物，状态面板内添加选项内容花、草；

状态二命名动物，状态面板添加选项内容鸟、鱼。

（3）三级菜单建立规则同二级。建立一个动态面板（命名：具体生物），四个状态（分别命名花、草、虫、鱼），各状态选项内容同下图

各级菜单选项内容 各选项对应的动态面板

2.设置一级菜单、二级菜单选项内容改变时的事件：OnSelectionChange。

一级菜单选择内容变化，二级菜单同步变化 二级菜单选择内容变化，三级菜单同步变化

3.设置动态面板（生物）改变时的事件：

只需设置二级菜单面板改变事件

4、F5预览查看吧