深入浅出jQuery中的事件机制

//ready的作用,是为具体加载的实现.
$(document).ready(function(){
alert('1234');
});
//第二种,少了一个document,创建一个空的jQuery对象.
$().ready(function(){
alert('abcd');
});
//第三种,简写版的,
$(function (){
alert('23333');
});

//如果有两个window.onload它只会执行最后一个.如果有多个的话,后边的会将前面的覆盖掉.
window.Onload=function(){
alert(1);
}
window.Onload= function(){
alert(2);
}
//而window.ready 则可以设置多个函数,都去作用.
$(document).ready(function(){alert(1)})
$(document).ready(function(){alert(3)})
//这里的可以设置多个函数,是指的对于同一个对象设置

//DOM1级事件
var itNode = document.getElementById('id');
itNode.Onclick= function(){};
div.Onclick= null; DOM1级中解除事件绑定
//DOM2级事件
itNode.addEventListener('click',function(){});
itNode.removeEventListener();
itNode.attachEvent();//IE 6 8 7 兼容性处理
detachEvent(); IE中接触事件绑定
//使用jQuery来操作绑定事件
//$().事件类型(function(){});
//$().事件类型();
$(function(){
$('div').click(function(){//给div绑定了一个onclick事件
$('div').css('color','green');
});
$('div').mouseover(function(){
$(this).css('color','yellow');
});
});

//$().bind(事件类型,事件处理函数(分为有名函数,和匿名函数))
$(function(){
//绑定一个鼠标移动上去处理的事件.
$('div').bind('mouseover',function(){
$('div').css('background-color','blue');
});
$('div').bind('mouseout',function(){
$('div').css('background-color','yellow');
});
//一个函数绑定多个事件 这多个时间之间只需要用空格隔开.
//这个虽然可以绑定多个事件,但是函数比较单一,不灵活.
$('div').bind('mouseover mouseout',function(){
console.log(1234);
});
//使用对象的形式来绑定多个事件,
$('div').bind({
click: function(){console.log(1);},
mouseover: function(){alert(22);},
mouseout : function(){alert(33);}
});
//绑定有名的函数
function fa(){alert("fa");};
function fb(){alert("fb");};
function fc(){alert("fc");};
$('div').bind('click',fb);
$('div').bind('click',fc);
$('div').unbind();//这样直接调用unbind函数会直接将所有绑定的事件都取消掉.
$('div').unbind('click');//这样子就会将div里边所有的click绑定的事件取消掉了
//直接解除指定的函数的绑定,这种方式也只能解除有名函数的绑定,不能解除指定的匿名函数的绑定
$('div').unbind('click',fa);
});

function(evt){
var evt = evt || window.event;
evt.preventDefault();//主流浏览器阻止默认事件
evt.returnValue = false;// IE中阻止对象默认事件
evt.stopPropagation();//主流浏览器中阻止浏览器冒泡
evt.cancelBubble();//IE中阻止浏览器冒泡处理
}
$().bind('click',function(evt){
//evt不用做兼容性处理
evt.preventDefault();//阻止浏览器的默认动作.
evt.stopPropagation();//阻止浏览器冒泡,
});