摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jquery的事件函数</title> <script type=&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery的事件函数</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
</head>
<body>
<script>
// 在jquery中是以调用事件函数的方式来触发事件的，如js中的onclick事件，在jquery中用click()来替代
//简单的理解：事件方法会触发匹配元素的事件，或者将函数绑定到所有匹配元素的某个事件
// ready() 当文档对象模型加载完成，触发事件==js的onload
//不可以与<body onload="">一起使用
// $(document).ready(function(){
//
// })
//blur()当失去焦点时触发==onblur
//change()当元素的值发生改变
//click()点击事件
$(document).ready(function(){
// $('input').blur(function(){
// $('input').css('background','red')
// })
// $('input').focus(function(){
// $('input').css('background','blue')
// })
// $('input').change(function(){
// $('input').css('background','pink')
// })
// $('button').click(function(){
// $('div').css('background','pink')
// })
// $('div').dblclick(function(){
// $(this).css('background','pink')
// })
// $(document).mousemove(function (aa) {
// $('span').text('x: '+aa.pageX+'y: '+aa.pageY)
// })
// a=0;
// $(window).resize(function(){
// //alert('窗口被调整大小')
// $('b').text(a++)
// })
// $('div').mouseover(function(){
// $(this).css('background','pink')
// })
// $('div').mouseenter(function(){
// $(this).css('background','pink')
// })
// $('div').mouseleave(function(){
// $(this).css('background','blue')
// })
// $('div').mouseout(function(){
// $(this).css('width','50px')
// })
// $('div').mousedown(function(){
// $(this).css('width','50px')
// })
$('div').mouseup(function(){
$(this).css('width','50px')
})
})
</script>
<input type="text" name="">
<!--<div style="width:100px;height:100px;background: red;margin-top: 20px;"></div>-->
<!--<button>点击</button>-->
<!--<div>-->
<!--当前鼠标的位置:<span></span>-->
<!--</div>-->
<!--<div>-->
<!--页面被调整次数:<b></b>-->
<!--</div>-->
<div style="width:100px;height:100px;background: red;">测试</div>
</body>
</html>
理解：类似于js中的事件，只是写法不同，比js方便
