下拉选单(droplist)交互设计-控制另一个下拉选单

说明：

在同一页面，有2 个下拉选单- A 和 B。下拉的选项分别各有 2 个- a1, a2, b1, b2。

交互设计要做到的效果：
当 A 选择 a1 时，B 自动变为 b1
当 A 选择 a2 时，B 自动变为 b2

　》浏览这个范例的Prototype
　》下载这个范例的RP文件(下载后请解压缩)
　》教学影片-以下拉选单(droplist)来控制换页 1分24秒

作法：

详细教学请参考　》教学影片-以下拉选单(droplist)来控制换页 1分24秒。

当Droplist物件遇到OnChange的触发Event时 (请留意不是 OnClick )，新增交互设计的Case。

新增Case之后，设定符合条件的状况 - 在 "Add Condition" (或 "Edit Condition")的窗格，选择 selected option of A 等于 a1。

接着，定义正确的交互Action - 在 "Set Variable and Widget value(s) equal to Value(s) " 的窗格中，选择 Set selected option of B 到 b1。

完成后的交互设计的statement如下:

OnChange:
Case 1 (If selected option of A equals "a1"):
Set selected option of B equal to "b1"
Case 1 (Else If selected option of A equals "a2"):
Set selected option of B equal to "b2"

类似的教学范例可参考 - 下拉选单(droplist)交互设计-控制换页。

---

访客留言

1. the1826 2009/12/14 / 2下午

   我试了一下，好像onChange和onClick事件都可以啊？