在之前的文章中，我們介紹過在axure中自定義文本框樣式的方法，今天我們再深入一些，當文本框的焦點發生變化時，動態切換焦點文本框的樣式。
先看效果：
製作步驟：
先把文本框的默認樣式做出來：
拖入兩個文本框，分別命名爲用戶名、密碼，隱藏邊框，設置好提示文字；、
拖入兩個矩形，設置高度略大於文本框，邊框顏色爲淺灰色，分別命名爲用戶名邊框、密碼邊框，分別把兩個文本框置於對應的邊框上方。
開始做交互，當文本框獲取焦點時，改變邊框顏色：
當文本框獲取焦點時，把對應的邊框矩形設置爲選中狀態，失去焦點時，取消對應的邊框矩形的選中狀態。用例如下：
設置兩個邊框矩形的“選中”樣式：線段顏色爲橙色；
當頁面載入時，焦點應該自動設置在用戶名文本框中，所以在頁面載入時添加用例如下：
需要說明的是，這個自動獲取焦點動作在chrome瀏覽器中可能沒有效果，使用IE內核的瀏覽器如（搜狗瀏覽器）是可以的；
其中“設置選中狀態於 用戶名邊框="true"”這個動作必須要加上，否則沒有效果。
OK，大功告成~~