1.event.currentTarget//在事件冒泡階段中的當前DOM元素?
$("p").click(function(event) {alert( event.currentTarget === this ); // true });
2.event.data//當前執行的處理器被綁定的時候,包含可選的數據傳遞給jQuery.fn.bind。
$("a").each(function(i) {$(this).bind('click', {index:i}, function(e){alert('my index is ' + e.data.index);});});
?
3.event.delegateTarget//當currently-called的jQuery事件處理程序附加元素。
$(".box").on("click", "button", function(event) {
? $(event.delegateTarget).css("background-color", "red");
});
// 為id為element的元素中的所有span元素綁定click事件
$("#element").on( "click", "span", function(event){
? ? // event.delegateTarget 就是id為element的DOM元素
? ? // this 就是當前觸發事件的span元素
? ? alert( event.delegateTarget === this); // false
} );
// 為id為element的元素中的所有span元素綁定click事件
$("#element span").bind( "click", function(event){
? ? // event.delegateTarget 就是當前觸發事件的span元素
? ? // this 就是當前觸發事件的span元素
? ? alert( event.delegateTarget === this ); // true
} );
?
4.event.isDefaultPrevented()//根據事件對象中是否調用過 event.preventDefault() 方法來返回一個布爾值
$("a").click(function(event){alert( event.isDefaultPrevented() ); // falseevent.preventDefault();alert( event.isDefaultPrevented() ); // true});
?
5.event.isImmediatePropagationStopped()//根據事件對象中是否調用過 event.stopImmediatePropagation() 方法來返回一個布爾值。
function immediatePropStopped(e) {var msg = "";if ( e.isImmediatePropagationStopped() ) {msg = "called";} else {msg = "not called";}$("#stop-log").append( "<div>" + msg + "</div>" );}$("button").click(function(event) {immediatePropStopped(event);event.stopImmediatePropagation();immediatePropStopped(event);});
?
6.event.isPropagationStopped()//根據事件對象中是否調用過 event.stopPropagation() 方法來返回一個布爾值。
function propStopped(e) {var msg = "";if ( e.isPropagationStopped() ) {msg = "called";} else {msg = "not called";}$("#stop-log").append( "<div>" + msg + "</div>" );}$("button").click(function(event) {propStopped(event);event.stopPropagation();propStopped(event);});
?
7.event.namespace//當事件被觸發時此屬性包含指定的命名空間。
$("p").bind("test.something", function(event) {alert( event.namespace ); });$("button").click(function(event) {$("p").trigger("test.something");});
8.event.pageX//鼠標相對于文檔的左邊緣的位置。
? event.pageX//鼠標相對于文檔的左邊緣的位置。
$(document).bind('mousemove',function(e){$("#log").text("e.pageX: " + e.pageX + ", e.pageY: " + e.pageY);});
?
9.event.preventDefault()//阻止默認事件行為的觸發。
$("a").click(function(event) {event.preventDefault();$('<div/>').append('default ' + event.type + ' prevented').appendTo('#log');});
?
10.event.relatedTarget//在事件中涉及的其它任何DOM元素
對于 mouseout 事件,它指向被進入的元素;對于 mousein 事件,它指向被離開的元素。
$("a").mouseout(function(event) {alert(event.relatedTarget.nodeName); // "DIV"});
?
11.event.result//這個屬性包含了當前事件事件最后觸發的那個處理函數的返回值,除非值是 undefined 。
$("button").click(function(event) { return "hey"; });$("button").click(function(event) {$("p").html( event.result );});
12.event.stopImmediatePropagation()//阻止剩余的事件處理函數執行并且防止事件冒泡到DOM樹上。
$("p").click(function(event){event.stopImmediatePropagation();}); $("p").click(function(event){// This function won't be executed$(this).css("background-color", "#f00"); });$("div").click(function(event) {// This function will be executed$(this).css("background-color", "#f00");});
13.event.stopPropagation()//防止事件冒泡到DOM樹上,也就是不觸發的任何前輩元素上的事件處理函數。
$("p").click(function(event){event.stopPropagation(); // do something});
?
14.event.target//最初觸發事件的DOM元素。
function handler(event) {var $target = $(event.target);if( $target.is("li") ) {$target.children().toggle();}}$("ul").click(handler).find("ul").hide();
15.event.timeStamp//這個屬性返回事件觸發時距離1970年1月1日的毫秒數。
var last, diff; $('div').click(function(event) {if ( last ) {diff = event.timeStamp - last;$('div').append('time since last event: ' + diff + '<br/>');} else {$('div').append('Click again.<br/>');}last = event.timeStamp;});
?
16.event.type//事件類型
$("a").click(function(event) {alert(event.type); // "click"});
?
17.event.which//針對鍵盤和鼠標事件,這個屬性能確定你到底按的是哪個鍵或按鈕。
<script>$('#whichkey').bind('keydown',function(e){$('#log').html(e.type + ': ' + e.which ); });</script>
?