on()方法用来处理事件。jQuery会处理所有浏览器的兼容性问题。
on()方法可以指定影响哪个事件,相当于JavaScript中的addEventListener()事件监听。
on()方法有两个参数:
第一个参数,是事件,同addEventListener()事件监听的第一个参数一样,用引号括起事件名。
第二个参数,是代码,可以命名函数,也可以是匿名函数。
示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>事件方法</title> <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"> </script> </head> <body> <div> <ul id="ul"> <li id="a">鼠标</li> <li id="b">键盘</li> <li id="c">屏幕</li> <li id="d"><a>主机</a></li> </ul> </div> <script> $('li').on('click',function(){ alert($(this).text()); }); </script> </body> </html>
常见的jQuery事件
- 用户界面:focus、blur、change
- 键盘:input、keydown、keyup、keypress
- 鼠标:click、dblclick、mouseup、mousedown、mouseover、mousemove、mouseout、hover
- 表单:submit、select、change
- 文档:ready、load、unload
- 浏览器:error、resize、scroll