Axure教程：網(wǎng)頁二級聯(lián)動交互應(yīng)該怎么做？

2 評論 10162 瀏覽 47 收藏 4 分鐘

本文用案例說明一下網(wǎng)頁二級聯(lián)動交互怎么做，主要是表單元件結(jié)合動態(tài)面板來實現(xiàn)~

步驟如下

（1）準(zhǔn)備下拉列表框

選擇一個表單元件，我們要選擇的是“下拉列表框”，對表單元件進(jìn)行簡單的美化操作（如下圖所示）。

（2）添加動態(tài)面板

在“市”后面添加一個動態(tài)面板，動態(tài)面板的名稱命名為“市”。

（3）設(shè)置“省”后面的下拉列表框

這次我們的事例簡單演示一下三個省，安徽省、山東省、河北省，選擇每個省時，相對應(yīng)的是省下面的市。雙擊下拉列表框，添加三個省的名稱。

（4）設(shè)置“市”后面的動態(tài)面板

因為要做三個省對應(yīng)下面的市，所以在“市”的動態(tài)面板下面添加三個動態(tài)面板。添加完之后，重命名。

雙擊“安徽省”動態(tài)面板，復(fù)制或添加一個下拉列表框到動態(tài)面板里面，然后雙擊進(jìn)行編輯，添加安徽省下面所有對應(yīng)的市（如下圖）。

下面兩個省，如同安徽省的操作一樣，操作兩次。

（5）回到index主面板，對省后面的下拉列表框添加“交互事件操作”

雙擊“選項改變時”。

同樣的方法操作下面兩省即可（如下圖）。

網(wǎng)頁二級聯(lián)動交互完成了，你可以驗證一下~

 

本文由 @葛園園 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議

更多精彩內(nèi)容，請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
葛園園
2篇作品 22607總閱讀量
09-251002 瀏覽
云盤產(chǎn)品量化分析系列之（3）：會員音視頻權(quán)益
10-204689 瀏覽
“沒錯 對的”……會接話月薪8K起？直播捧哏火了
08-253662 瀏覽
拼多多海外版Temu，為什么沒有選擇“農(nóng)村包圍城市”？
05-0511171 瀏覽
表格設(shè)計那些事兒
03-197273 瀏覽
新老商家在淘寶天貓的遠(yuǎn)慮與近憂
評論
評論請登錄

  1. 我還以為是什么呢，原來如此。。

    來自北京 回復(fù)