起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識Axure教學（中級）：驗證碼發送倒計時
在產品注冊頁面，當點擊發送驗證碼后，會進入倒計時，計時結束后才能重新點擊發送，這個效果是如何做出來的呢？
生活中，我們經常看到網站、APP的注冊頁面，當點擊發送驗證碼后，會進入倒計時，計時結束后才能重新點擊發送。
一、頁面布局
從左側元件庫拉入一個【矩形】作為驗證碼按鈕，兩個【文本框】作為手機輸入框和短信驗證碼輸入框，如下：
首先雙擊【驗證碼矩形】，將文本設置為：發送驗證碼；
其次，點擊【頂部菜單欄】-》【項目】-》【全局變量】，點擊彈窗中的“+”號，添加驗證碼的【全局變量】，這里命名為：captcha；想從哪個數字開始倒計時，即將此變量的默認值設置為哪個數字（此案例設為10）；
二、添加交互
實際效果為：當點擊驗證碼按鈕時，驗證碼文案會變為“10秒后重新獲取”，接下來變為9、8、7……秒后重新獲取。
實現流程為：選中驗證碼矩形，雙擊右側【屬性】欄中的【鼠標點擊時】；
選擇左側導航中【設置文本】-》勾選【當前元件】-》設置文本的值為“[[captcha]]秒后重新獲取”；
因為之前已經將全局變量captcha的默認值設為10，所以預覽時文本為 “10秒后重新獲取”；
接下來需要設置等待事件，讓文案每隔一秒，進行變化一次；
即選擇左側導航中【其他】-》【等待】-》等待時間設為“1000”毫秒；
然后讓全部變量 “captcha” 減1，變為9、8、7……..，即再次選擇左側導航中【全局變量】-》【設置變量值】-》勾選【captcha】，值設置為：[[captcha-1]]。此時，“captcha” 的值已經變為“9”；
最后，需要重新觸發最先的點擊按鈕交互事件，讓驗證碼的文本發生變化，即變為：“9秒后重新獲取”；并且重復執行該交互。
因此，再次選擇左側導航中【其他】-》【觸發事件】-》勾選【當前元件】-》勾選【鼠標單擊時】。
三、交互細節調整
正常情況下，應該是倒計時為0秒時停止計時，按鈕文本變為“重新獲取”。點擊重新獲取，則重新執行倒計時效果。
因此，需要對全局變量進行判斷，當全局變量大于等于0時，執行上面的交互。否則（小于0），直接讓文本變為 “重新獲取”；
并且讓全局變量【captcha】重新設置10，這樣，重新點擊【驗證碼】按鈕時，由于全局變量【captcha】大于0，才能夠重新執行鼠標點擊的交互事件。
給case1添加條件，當變量值【captcha】>=0時，執行事件；
再次選中驗證碼矩形，雙擊右側【屬性】欄中的【鼠標點擊時】，添加case2；選擇左側導航中【設置文本】-》勾選【當前元件】-》設置文本的值為“重新獲取”；
選擇左側導航中【全局變量】-》【設置變量值】-》勾選【captcha】，值設置為：10。
四、預覽效果
示例下載：
https://pan.baidu.com/s/1uN7AiwbB604wdSqpA6pNZA
示例演示：
如有問題歡迎在評論區留言！
作者：火星人～艾斯，公眾號：艾斯的Axure峽谷
本文由 @火星人～艾斯 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基于CC0協議
歡迎關注個人公眾號：艾斯的Axure峽谷
case1開始應該增加一個禁用原件的步驟，同樣case2最后應該增加啟用原件的步驟。否則可以一直點擊，秒速不準。
哈哈，多謝指點