javascript學習筆記（五）：異常捕獲和事件處理
阿新 • • 發佈：2017-06-13
log 類型 按鈕 輸入 button lan yellow logs 代碼
異常捕獲
Try{
發生異常的代碼塊
}catch(err){
異常信息處理
}
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta chaset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <form> 9 <input id="txt" type="text"> 10 <input id="btn" type="button" onclick="demo()" value="按鈕"> 11 </form> 12 <script> 13 function demo(){ 14 try{ 15 var e = document.getElementById("txt").value; 16 if(e==""){ 17 throw "請輸入"; //一般throw會與try,catch配合使用18 } 19 }catch(err){ 20 alert(err); 21 } 22 } 23 </script> 24 </body> 25 </html>
事件處理
1、onclick鼠標點擊事件
2、onmouseout鼠標離開事件
3、onmouseover鼠標經過事件
4、onchange文本框內容改變事件
5、onselect文本框內容選中事件
6、onfocus光標聚集事件
7、onload網頁加載完畢事件
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta chaset="UTF-8"> 5 <title></title> 6 <link rel="stylesheet" type="text/css" href="style.css"> <!--指定rel為樣式表，類型為css，外部文件為style.css--> 7 </head> 8 <body onload="onLoad()"> <!--onload網頁加載完畢事件--> 9 <button onclick="onClick()">按鈕</button> <!--onclick鼠標點擊事件--> 10 <div class="div" onmouseout="onOut(this)" onmouseover="onOver(this)"></div> <!--onmouseout鼠標離開事件，onmouseover鼠標經過事件 --> 11 <form> 12 <input type="text" onchange="onChange(this)"> <!--onchange文本框內容改變事件--> 13 <br> 14 <input type="text" onselect="onSelect(this)" onfocus="onFocus(this)"> <!--onselect文本框內容選中事件，onfocus光標聚集事件--> 15 </form> 16 <script> 17 function onClick(){ 18 alert("onclick鼠標點擊"); 19 } 20 function onOver(ooj){ 21 ooj.innerHTML="onmouseover鼠標經過"; 22 } 23 function onOut(ooj){ 24 ooj.innerHTML="onmouseout鼠標離開"; 25 } 26 function onChange(bg){ 27 alert("onchange文本框內容改變"); 28 } 29 function onSelect(bg){ 30 bg.style.background="yellow"; 31 alert("onselect文本框內容選中"); 32 } 33 function onFocus(bg){ 34 bg.style.background="green"; 35 alert("onfocus光標聚集"); 36 } 37 function onLoad(){ 38 alert("onload網頁加載完畢"); 39 } 40 </script> 41 </body> 42 </html>
javascript學習筆記（五）：異常捕獲和事件處理