jQuery事件1-第5次课-JQ的事件跟JS一样的作用，只是写法不一样-附案例、任务

//JQ和JS一样
<div οnclick="fun(this)"></div>
<script>
    function fun(obj){
        //fun即为事件处理程序
        obj.style.color='red';
    }
</script>
//JQ
<div οnclick="fun(this)"></div>
<script>
    function fun(obj){
        //fun即为事件处理程序
        $(obj).css("color",'red');
    }
</script>

//JS:
var odiv=document.getElementById("box");
  odiv.onclick=function(){
    }
//缺点：只能写一个同类型的事件，团队协作中，经常会给同一个元素绑定相同的事件类型，就会存在覆盖问题。
//JQ:
$("#box").click(function(event){
    //$("#box")  事件源
    //click 事件类型
    //click的参数为函数，该函数即为事件处理程序
    //event 事件对象
});
//键盘抬起
$("#ipt").keyup(function(){
});

//JS
var odiv=document.getElementById("box");
  odiv.addEventListner("click",function(){
       //写函数体                  
},false)
//JQ:
可以给同一个元素绑定不同的事件类型，或者给同一个元素绑定相同的事件类型。
1.
  $("div").bind('事件类型1',事件函数);
  $("div").bind('事件类型1 事件类型2',事件函数);
  //多个事件类型都共用同一个事件函数，即触发的事件都会执行相同的事件函数。
  比如：
    $("div").bind('click',function(){});
  比如：
    $("div").bind('click mouseout',function(){});
2. 链式操作，比如给它绑定不同的事件和不同的事件处理函数
  $("div").bind('事件类型1',function(){}).bind('事件类型2',function(){});
3.对象的写法
  $("div").bind({
        click:function(){
            //事件1的写法
        },
        mouseout:function(){
            //事件2的写法
        }
    });
//总结：以上3种写法可任选一种，怎么玩都不会出问题

$("div").hover(鼠标移入时的函数,鼠标离开时的函数);
//说明：
1、当鼠标移入到绑定的元素上时，自动执行函数1
2、当鼠标离开该元素时，则自动执行函数2

$("div").one("click",function(){
    alert("执行一次再次执行则失效")
})
//js没有，原理，是在执行完后将其解绑

//JS
元素.事件类型=null;//解绑

//jQ
元素.removeEventListner("click",函数名);

$("div").unbind("click");// 解绑该div上的click事件
$("div").unbind("click",函数名);//解绑该div上特定的点击事件
$("div").unbind();//解绑它身上所有的事件，不区分事件类型