JavaScript如何取得焦點和失去焦點
- 醉折花枝作酒筹轉載
- 2021-04-29 09:17:374358瀏覽
本篇文章要為大家介紹JavaScript取得焦點和失去焦點的方法。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有幫助。
焦點處理
焦點處理主要包括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>
#注意：如果時隱藏欄位（
【推薦學習：javascript高階教學】
#以上是JavaScript如何取得焦點和失去焦點的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文轉載於：csdn.net。如有侵權，請聯絡admin@php.cn刪除