視窗事件和表單事件
阿新 • • 發佈:2021-12-10
一:視窗事件
window.onfocus = function(){ // 視窗獲取焦點事件};
window.onblur= function(){ // 視窗失去焦點事件};
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script> 7 window.onload=function () { 8 varbox=document.getElementById('box') 9 console.log(box) 10 box.onclick=function () { 11 console.log("我被點選了") 12 } 13 } 14 </script> 15 </head> 16 <body> 17 <div id="box">dsfxvggdx</div> 18 </body> 19 </html>
二 :表單事件
onblur:某元素失去活動焦點時產生該事件。例如滑鼠在文字框中點選後又在文字框外點選時就會產生。
onfocus(ns3,ns4,ie3,ie4)網頁上的元素獲得焦點時產生該事件
onclick(ns3,ns4,ie3,ie4)單擊網頁上的某元素時產生
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 #accountSpan{display: none}8 </style> 9 </head> 10 <body> 11 <form action=""> 12 <label for="account"> 13 <input type="text" id="account" name="account"> 14 </label> 15 <span id="accountSpan">請輸入正確手機號</span> 16 <label for="password"> 17 <input type="password" id="password" name="password"> 18 </label> 19 <input type="submit"> 20 </form> 21 </body> 22 </html> 23 <script> 24 var account=document.getElementById('account') 25 var accountSpan=document.getElementById('accountSpan') 26 27 account.onblur=function () { 28 accountSpan.style.display='inline' 29 } 30 account.onfocus=function () { 31 accountSpan.style.display='none' 32 } 33 </script>