onFocus:當輸入框得到焦點後javascript
這兩個JavaScript事件是寫在html標籤中的例如：html
<input type="text" onBlur=" " onFocus=" " />
使用jQuery的實現方法爲：java
對於元素的焦點事件，咱們能夠使用jQuery的焦點函數focus(),blur()。jquery
focus()：獲得焦點時使用，blur()：失去焦點時使用。函數
代碼以下:post
$("input").focus(); 或$("input").focus(function(){這裏是獲取焦點時的事件})
$("input").blur(); 或$("input").blur(function(){這裏是失去焦點時的事件})
一樣能夠使用jQuery中提供的:focus僞類來斷定元素是否獲取焦點；this
// Get the focused element:
var $focused = $(':focus');
// No jQuery:
var focused = document.activeElement;
// Does the element have focus:
var hasFocus = $('input').is(':focus');
// No jQuery:
elem === elem.ownerDocument.activeElement;
下面寫一個實例：spa
按 Ctrl+C 複製代碼
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<style>
.bor{
border:3px solid red;
}
</style>
<BODY>
<input type="text"/>
<script type="text/javascript" src="jquery-1.11.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function(){
$(this).addClass("bor");
});
$("input").blur(function(){
$(this).removeClass("bor");
});
});
</script>
</BODY>
</HTML>code
按 Ctrl+C 複製代碼
固然還能夠根據獲取元素的狀態修改其餘元素的各項屬性，或者是須要發生的事件htm