1 <!-- 事件函数列表： 2 blur() 元素失去焦点 3 focus() 元素获得焦点 4 click() 鼠标单击 5 mouseover() 鼠标进去（进入子元素也触发） 6 mouseout() 鼠标离开（离开子元素也触发） 7 mouseenter() 鼠标进入（进入子元素不触发） 8 mouseleave() 鼠标离开（离开子元素不触发） 9 hover() 同时为mouseenter和mouseleave事件指定函数 10 ready() DOM加载完成 11 resize() 浏览器窗口的大小发生改变 12 scroll() 滚动条的位置发生变化 13 submit() 用户递交表单 14 --> 15 <!DOCTYPE html> 16 <html lang="en"> 17 <head> 18 <meta charset="UTF-8"> 19 <title>Document</title> 20 <script type="text/javascript" src="../jquery-1.12.4.min.js"></script> 21 <script type="text/javascript"> 22 $(function(){ 23 24 // 在获取焦点的时候做什么事情 25 /* 26 $('#input01').focus(function(){ 27 alert('获取焦点'); 28 }) 29 */ 30 31 // 一进入页面就获取输入框焦点，提高用户体验 32 $('#input01').focus(); 33 34 // 失去焦点，用于表单提交时如果用户输入不规范，弹窗提醒 35 $('#input01').blur(function(){ 36 var sVal = $(this).val(); 37 // 获取input里的值 38 alert(sVal); 39 }) 40 41 $('#form1').submit(function(){ 42 // alert('已提交'); 43 44 45 // 阻止默认提交行为 46 return false; 47 }) 48 }); 49 </script> 50 </head> 51 <body> 52 <form id="form1"> 53 <input type="text" name="" id="input01"> 54 <input type="text" name="" id="input02"> 55 <input type="submit" name="" value="提交" id="sub"> 56 </form> 57 </body> 58 </html>