Javascript中,focus()函數是用來激活 HTML 元素的。這個方法很常用,我們可以利用它來實現很多非常實用的功能,例如:
var input = document.getElementById("myInput"); input.focus();
上面這段代碼可以用來讓一個文本框自動獲取焦點,這樣用戶就不需要手動點擊一下文本框才能進行輸入了。
此外,在表單驗證中,我們通常需要在用戶輸入完畢后對輸入的數據進行驗證。這時候,我們可以利用focus()函數和onblur()事件來實現這個功能,例如:
var input = document.getElementById("myInput"); input.onblur = function() { if(this.value === "") { alert("請輸入數據!"); this.focus(); } }
上面這段代碼可以讓用戶在離開文本框時,在文本框為空的情況下彈出一個提示框,并讓文本框重新獲取焦點,以便用戶繼續輸入。
再比如,我們在頁面中經常需要讓菜單欄自動展開和隱藏。這時候,我們可以利用focus()函數和onmouseover()事件來實現鼠標滑過菜單欄時自動展開,例如:
var menu = document.getElementById("myMenu"); menu.onmouseover = function() { this.focus(); }
上面這段代碼可以讓菜單欄在鼠標滑過時自動展開。不過,要讓這段代碼生效,我們還需要在CSS中給菜單欄添加一個tabindex屬性,例如:
#myMenu { tabindex: 0; }
這樣一來,當用戶用鼠標滑過菜單欄時,菜單欄就會自動展開了。
總之,Javascript中的focus()函數非常實用,它可以用來實現很多常見的功能。要使用這個函數,我們只需要通過document.getElementById()等方法獲取到需要激活的 HTML 元素,再調用focus()函數即可。
上一篇oa.php
下一篇oa辦公系統源碼 php