<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-3.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//简写事件 :把on()绑定的事件名以及函数直接用 "点语法" 形式绑定给标签
//我们可以通过简写事件给相同的标签添加不同的事件
$(document).ready(function(){
//$('div').click(function(){
// alert('点击过了');
//});
//获取焦点
$('input').focus(function(){
$(this).css('background-color','red')
});
//失去焦点
$('input').blur(function(){
$(this).css('background-color','white')
});
//窗口/文档的滚动事件 :当页面滚动时，不断触发该方法
$(window).scroll(function(){
console.log('开始滚动')
})
//当用户关闭/离开当前页面的时候，需要做数据保存，这些工作在unload事件中执行， 在这些情况下执行:页面关闭/刷新/重新加载页面/跳转新连接/点击前进/后退按钮
$(window).unload(function(){
})
//复合事件 hover(fn1,fu2) 当鼠标移入触发fn1 当鼠标移除触发fn2事件 对应的两个鼠标 事件
mouseenter mouseleave
mouseover 和 mouseenter 区别:
//over: 鼠标划过触发
//enter: 鼠标移入触发
/*$('div').hover(function(){
$('this').css('background-color','red');
},function(){
$('this').css('background-color','white');
});*/
});
</script>
</head>
<body style="height: 2000px;">
<div style="width: 100px; height: 100px; border:1px solid red;"></div>
<input type="text" name="" id="" value="" />
</body>
</html>
