溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“javascript怎么處理焦點”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“javascript怎么處理焦點”吧!
javascript處理焦點的方法：1、通過“field.focus();”方法獲取焦點；2、通過“o[i].blur = function(){...}”方法處理失去焦點。
本文操作環境：windows7系統、javascript1.8.5版、DELL G3電腦
javascript如何處理焦點？
JavaScript焦點處理（獲取焦點focus、失去焦點blur）
焦點處理
焦點處理主要包括focus（獲取焦點）和blur（失去焦點）事件類型。所謂焦點，就是激活表單字段，使其可以響應鍵盤事件。
獲取焦點：focus
當單擊或使用Tab鍵切換到某個表單元素或超鏈接對象時，會觸發該事件。focus事件是確定頁面內鼠標當前定位的一種方式。在默認情況下，整個文檔處于焦點狀態，但是單擊或者使用Tab鍵可以改變焦點位置。‘
示例：在頁面加載完畢后，將焦點轉移到表單中的第一個文本框字段，讓其準備接收用戶輸入
<form id="myform" method="post" action="#">
姓名<input type="text" name="name"/><br>
密碼<input type="password" name="pass" /></form>
<script>
var form = document.getElementById("myform");
var field = form.elements("name");
window.onload = function(){
field.focus();
}
</scriipt>失去焦點：blur
blur事件類型表示在元素失去焦點時響應，它與focus事件類型是對應的，主要作用于表單元素和超鏈接對象
示例：為所有輸入表單元素綁定了focus和blur事件處理函數，設置當元素獲取焦點時呈凸起，失去焦點呈凹陷
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title> </head> <body>
<input type="text" />
<input type="text" />
<script>
var o = document.getElementsByTagName("input");
for(var i = 0; i < o.length; i++){
o[i].onfocus = function(){
this.style.borderStyle = "outset";
}
o[i].blur = function(){
this.style.borderStyle = "inset";
} }
</script>
</body></html>
注意：如果時隱藏字段（< input type=“hidden” >），或者使用CSS的display和visibility隱藏字段顯示，設置其獲取焦點將引發異常。
到此，相信大家對“javascript怎么處理焦點”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
