文字方塊(input)取得焦點(onfocus)時樣式改變的範例程式碼_javascript技巧

摘要：許多重視使用者體驗的設計師都希望為文字方塊(input)加上獲取焦點或滑鼠懸停時的樣式切換效果。其實很簡單，我們只需要取得頁面上的文字框，加上onfocus事件或其他對應的事件。本文介紹如何在取得焦點時切換樣式，明白原理後，實現其他效果就很簡單了。

許多重視使用者體驗的設計師都希望為文字方塊(input)加上取得焦點或滑鼠懸停時的樣式切換效果。其實很簡單，我們只需要取得頁面上的文字框，加上onfocus事件或其他對應的事件。本文介紹如何在取得焦點時切換樣式，明白原理後，實現其他效果就很簡單了。

複製碼 代碼如下:

 elements = document.getElementsByTagName("input");
              for (var i=0; i                   elements[i]. onfocus = function() { this.className = focusClass; };
                         }
             }
        }

        window.onload = function() {
            focusInput('focusInput 🎜>

複製程式碼


程式碼如下: