事件函數列表
blur() 元素失去焦點
focus() 元素獲得焦點
click() 鼠標單擊
mouseover() 鼠標進入（進入子元素也觸發）
mouseout() 鼠標離開（離開子元素也觸發）
mouseenter() 鼠標進入（進入子元素不觸發）
mouseleave() 鼠標離開（離開子元素不觸發）
hover() 同時為mouseenter和mouseleave事件指定處理函數
ready() DOM加載完成
resize() 瀏覽器窗口的大小發生改變
scroll() 滾動條的位置發生變化
submit() 用戶遞交表單
編寫一個form表單，用來演示輸入框獲取焦點和失去焦點的示例
好了，有了基本的HTML架構之后，就可以來演示了。
focus() 元素獲得焦點
首先先來這個focus()函數。
可以看到當獲取焦點的時候，就立即彈出alert()。
其實通過focus()函數只是簡單用來初始化文本框的焦點輸入的而已，如下：
當剛進入頁面，文本框就自動獲取焦點，這基本上就是這個方法的大部分用法了。
blur() 元素失去焦點
使用blur()失去焦點這個方法一般會結合獲取文本框內容的函數一起使用，如下：
當獲取到文本框內的值之后，就可以對其進行正則驗證或者其他方式的校驗。
那么這里有一個疑問，就是密碼框輸入內容的話，能否獲取到值呢？
密碼框也是可以正常獲取值的。
完整代碼
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="jquery/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(function(){
$('#username').focus();
$('#username').blur(function(){
// alert($(this).val());
})
$('#password').blur(function(){
alert($(this).val());
})
})
</script>
<style type="text/css">
</style>
</head>
<body>
<form action="#">
<!-- label{用戶名}+input.user+br+label{密碼}+input.pwd -->
<label for="username">用戶名</label>
<input type="text" id="username">
<br>
<label for="password">密   碼</label>
<input type="password" id="password">
<br>
<input type="submit" name="" value="提交">
</form>
</body>
</html>
