jquery事件对象属性小结

使用事件自然少不了事件对象. 因为不同浏览器之间事件对象的获取,以及事件对象的属性都有差异,导致我们很难跨浏览器使用事件对象.

jQuery中统一了事件对象, 当绑定事件处理函数时, 会将jQuery格式化后的事件对象作为唯一参数传入:

$("#testDiv").bind("click",function(event){});

关于event对象的详细说明,可以参考jQuery官方文档:http://docs.jquery.com/Events/jQuery.Event

jQuery事件对象将不同浏览器的差异进行了合并,比如可以在所有浏览器中通过event.target属性来获取事件的触发者(在IE中使用原生的事件对象,需要访问event.srcElement).

下面是jQuery事件对象可以在扩浏览器支持的属性:

$("a").click(function(event){
alert(event.type);
});

$("a[href=http://google.com]").click(function(event){
alert(event.target.href);
});

$("a").each(function(i){
$(this).bind("click",{index:i},function(e){
alert("myindexis"+e.data.index);
});
});

$("a").mouseout(function(event){
alert(event.relatedTarget);
});

$("p").click(function(event){
alert(event.currentTarget.nodeName);
});

$("a").click(function(event){
alert("Currentmouseposition:"+event.pageX+","+event.pageY);
});

$("p").click(function(event){
return"hey"
});
$("p").click(function(event){
alert(event.result);
});

varlast;
$("p").click(function(event){
if(last)
alert("timesincelastevent"+event.timeStamp-last);
last=event.timeStamp;
});

$("a").click(function(event){
event.preventDefault();
//dosomething
});

$("a").click(function(event){
alert(event.isDefaultPrevented());
event.preventDefault();
alert(event.isDefaultPrevented());
});

$("p").click(function(event){
event.stopPropagation();
//dosomething
});

$("p").click(function(event){
alert(event.isPropagationStopped());
event.stopPropagation();
alert(event.isPropagationStopped());
});

$("p").click(function(event){
event.stopImmediatePropagation();
});
$("p").click(function(event){
//Thisfunctionwon"tbeexecuted
});

$("p").click(function(event){
alert(event.isImmediatePropagationStopped());
event.stopImmediatePropagation();
alert(event.isImmediatePropagationStopped());
});