快好知 kuaihz订阅观点

 

Axure教程:网页二级联动交互应该怎么做?

本文用案例说明一下网页二级联动交互怎么做,主要是表单元件结合动态面板来实现~

步骤如下

(1)准备下拉列表框

选择一个表单元件,我们要选择的是“下拉列表框”,对表单元件进行简单的美化操作(如下图所示)。

(2)添加动态面板

在“市”后面添加一个动态面板,动态面板的名称命名为“市”。

(3)设置“省”后面的下拉列表框

这次我们的事例简单演示一下三个省,安徽省、山东省、河北省,选择每个省时,相对应的是省下面的市。双击下拉列表框,添加三个省的名称。

(4)设置“市”后面的动态面板

因为要做三个省对应下面的市,所以在“市”的动态面板下面添加三个动态面板。添加完之后,重命名。

双击“安徽省”动态面板,复制或添加一个下拉列表框到动态面板里面,然后双击进行编辑,添加安徽省下面所有对应的市(如下图)。

下面两个省,如同安徽省的操作一样,操作两次。

(5)回到index主面板,对省后面的下拉列表框添加“交互事件操作”

双击“选项改变时”。

同样的方法操作下面两省即可(如下图)。

网页二级联动交互完成了,你可以验证一下~

本站资源来自互联网,仅供学习,如有侵权,请通知删除,敬请谅解!
搜索建议:联动  联动词条  交互  交互词条  二级  二级词条  应该  应该词条  网页  网页词条  
原型

 Axure:菊花转(页面加载动画...

本文分享了页面加载动画如何制作,希望对大家有所帮助。先看效果:以下是制作步骤:第一阶段,素材准备(1)拉入一个圆注意:调整圆的大小,示例中是50*50。(2)设...(展开)

原型

 Axure原型设计之放大器

京东,天猫,淘宝等等这些电商的商品主图都会有放大器的功能,用户只需要将鼠标移到主图上就可以将图片放大查看细节。这种放大器方便用户更加深入地了解图片中的信息,从而...(展开)

原型

 Axure8.0实例 | 数量编...

在诸多购物平台中,包括app端,在下订单是时基本都需要选择购买的数量,此处需要有一个数量编辑器。该数量编辑器的主要特点是,可以通过左右两侧的加减号改变数量,也可...(展开)