焦點事件

得到焦點事件(onfocus)是當某個元素得到焦點時觸發事件處理程序。
失去焦點事件(onblur)是當前元素失去焦點時觸發事件處理程序。
通常狀況下,這兩個事件是同時使用的。
 
二 應用
文本框得到焦點時改變背景顏色
本示例是在用戶選擇頁面中的文本框時,改變文本框的背景顏色,當選擇其餘文本框時,將失去焦點的文本框背景顏色恢復原始狀態。
 
三 代碼
<table align="center" width="337" height="204" border="0">
<tr>
<td width="108">用戶名:</td>
<td width="213"><form name="form1" method="post" action="">
<input type="text" name="textfield" onfocus="txtfocus()" onBlur="txtblur()">
</form></td>
</tr>
<tr>
<td>密碼:</td>
<td><form name="form2" method="post" action="">
<input type="text" name="textfield2" onfocus="txtfocus()" onBlur="txtblur()">
</form></td>
</tr>
<tr>
<td>真實姓名:</td>
<td><form name="form3" method="post" action="">
<input type="text" name="textfield3" onfocus="txtfocus()" onBlur="txtblur()">
</form></td>
</tr>
<tr>
<td>性別:</td>
<td><form name="form4" method="post" action="">
<input type="text" name="textfield5" onfocus="txtfocus()" onBlur="txtblur()">
</form></td>
</tr>
<tr>
<td>郵箱:</td>
<td><form name="form5" method="post" action="">
<input type="text" name="textfield4" onfocus="txtfocus()" onBlur="txtblur()">
</form></td>
</tr>
</table>
<script language="javascript">
<!--
function txtfocus(event){ //當前元素得到焦點
var e=window.event;
var obj=e.srcElement; //用於獲取當前對象的名稱
obj.style.background="#FFFF66";
}
function txtblur(event){ //當前元素失去焦點
var e=window.event;
var obj=e.srcElement;
obj.style.background="FFFFFF";
}
//-->
</script>
---------------------
做者:chengqiuming
來源:CSDN
原文:https://blog.csdn.net/chengqiuming/article/details/70140140
版權聲明:本文爲博主原創文章,轉載請附上博文連接!javascript

相關文章
相關標籤/搜索