### on绑定事件
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
div{
width:100px;
height:100px;
border:1px solid red;
overflow: scroll;
}
</style>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script>
$(function() {
//原生中有的事件都可以像下面这么用(去掉on)
// $('#div1').click(function(){alert(123);});
//$('#div1').mouseover(function(){alert(123);});
//$('#div1').mousedown(function(){alert(123);});
$('#div1').scroll(function(){alert(123);})
//$('#div1').on('click', function(){alert(123);}) //这就相当于$('#div1').click(function(){alert(123);})
//$('#div1').on('click mouseover', function(){alert(123);}); //通过空格分隔多个事件名称,可以同时绑定
})
</script>
</head>
<body style="height: 2000px;">
<div id="div1">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</body>
</html>
~~~
***
### off取消事件
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script>
$(function() {
//无论是用on()还是用click()形式绑定的事件,都是用off()取消的
/*
$('#div1').on('click mouseover', function(){
alert(123);
$(this).off(); //删除所有的事件操作
})
*/
$('#div1').on('click mouseover', function(){
alert(123);
$(this).off('mouseover'); //取消指定的事件
})
})
</script>
</head>
<body style="height: 2000px;">
<div id="div1">aaaaaa</div>
</body>
</html>
~~~