event對象

Js的event對象用來描述Js的事件,它主要作用于IE和NN4(Netscape Navigator4)以后的各個瀏覽器版本中。event對象代表事件狀態(tài)腺怯,如事件發(fā)生的元素、鍵盤狀態(tài)、鼠標位置和鼠標按鈕狀態(tài)氓侧。一旦事件發(fā)生,便會生成event對象导狡,如單擊一個按鈕约巷,瀏覽器的內存中就產生相應的event對象。

1.在IE中引用event對象

在IE中旱捧,event對象被作為window對象屬性訪問:

window.event

由于window引用部分是可選的独郎,因此腳本像全局引用一樣對待event對象:

event.propertyName

這樣,一個事件處理程序的任何語句在不進行特殊處理和初始化的情況下枚赡,都可以訪問event對象氓癌。

2.在W3C中引用event對象

在W3C事件模型中,event對象引用比較復雜贫橙。在多數(shù)情況下贪婉,必須明確地將event對象作為一個參數(shù)傳遞到時間處理函數(shù)中。event對象有時可自動作為參數(shù)傳遞卢肃,這依賴于事件處理函數(shù)如何與對象綁定疲迂。
如果使用原始的方法將事件處理函數(shù)與對象綁定(通過元素標記的一個屬性),則必須把event對象作為參數(shù)傳遞莫湘。例如:

onKeyUp=“example(event)”

這是W3C模型中唯一像全局引用一樣明確引用event對象的方式尤蒿,這個引用只作為事件處理函數(shù)的參數(shù),在別的內容中不起作用幅垮。如果有多個參數(shù)腰池,則event對象引用可以以任意順序排列,例如:

onKeyUp=“example(this,event)”

與元素綁定的函數(shù)定義應該有一個參數(shù)變量來“捕獲event對象參數(shù):

function example(widget,evt){…}

這個參數(shù)變量名稱沒有任何限制忙芒,例子中示弓,使用event對象或evt。在跨瀏覽器的腳本中使用呵萨,應避免使用event作為參數(shù)變量名奏属,以避免與IE的event屬性沖突。

還可以通過其他方式將事件處理函數(shù)綁定到對象(在NN6+中甘桑,使用屬性賦值和W3C DOM的addEventListener()方法)拍皮,將這些事件處理函數(shù)的引用賦給文檔中所需的對象歹叮。例如:

document.forms[0].someButton.onKeyUp=example;
document.getElementById('myButton').addEventListener("KeyUp",example,false);

通過這些方式進行事件綁定可以防止自己的參數(shù)直接到達調用的函數(shù)。但是铆帽,W3C瀏覽器自動傳送event對象的引用并將它作為唯一參數(shù)咆耿,這個event對象是為響應激活事件的用戶或系統(tǒng)行為而創(chuàng)建的。也就是說爹橱,函數(shù)需要用一個參數(shù)變量來拒收傳遞的event對象:

function example(evt){…}

事件對象包含作為事件目標的對象(例如萨螺,包含表單控件對象的表單對象)的引用,從而可以訪問該對象的任何屬性愧驱。

3慰技、event對象的屬性

(1)altLeft屬性
該屬性設置或獲取左Alt鍵的狀態(tài)。檢索左Alt鍵的當前狀態(tài)组砚,返回值true表示關閉吻商,false為不關閉。
語法:

[window.]event.altLeft

由于altLeft屬性是Boolean值糟红,因此可以將該屬性應用到if語句中艾帐,根據(jù)獲取的值不同而執(zhí)行不同的操作。
(2)ctrlLeft屬性
該屬性設置或獲取左Ctrl鍵的狀態(tài)盆偿。檢索左Ctrl鍵的當前狀態(tài)柒爸,返回值true表示關閉,false為不關閉事扭。
語法:

[window.]event.ctrlLeft

由于ctrlLeft屬性是Boolean值捎稚,因此可以將該屬性應用到if語句中,根據(jù)獲取的值不同而執(zhí)行不同的操作求橄。
(3)shiftLeft屬性
該屬性設置或獲取左Shift鍵的狀態(tài)。檢索Shift鍵的當前狀態(tài)谈撒,返回值true表示關閉腥泥,false為不關閉。
語法:

[window.]event.shiftLeft

由于shiftLeft屬性是Boolean值蛆楞,因此可以將該屬性應用到if語句中豹爹,根據(jù)獲取的值不同而執(zhí)行不同的操作臂聋。
由于這3個屬性的值都是Boolean類型的,所以可以將它們組合成一個條件在if語句中應用采够,并且也可以和altKey蹬癌、ctrlKey和shiftKey屬性同時使用。
例:將altKey虹茶、ctrlKey和shiftKey屬性進行組合逝薪,組合成一個綜合的條件,應用if語句判斷當Ctrl鍵蝴罪、shift鍵和Alt鍵同時按下是執(zhí)行一個操作董济。
代碼如下:

<script>
    function example(){        //創(chuàng)建自定義函數(shù)
        //應用if語句判斷Ctrl鍵、shift鍵和Alt鍵是否同時被按下
        if(window.event.ctrlKey && window.event.altKey && window.event.shiftKey){
            //如果Ctrl鍵要门、Shift鍵和Alt鍵同時按下感局,則執(zhí)行下面的內容
            alert('Ctrl鍵、Shift鍵和Alt鍵同時按下啦!')
        }
    }
    document.onkeydown = example;
</script>

(4)botton屬性
該屬性設置或獲取事件發(fā)生時用戶所按的鼠標鍵暂衡。
語法:

[window.]event.button

該屬性的值如表所示询微。

說明 說明
0 表示沒有按鍵 4 按下中間鍵
1 按下左鍵(主鍵) 5 同時按下左鍵和中間鍵
2 按下右鍵 6 同時按下右鍵和中間鍵
3 同時按下左鍵和右鍵 7 同時按下左鍵、中間鍵和右鍵

當用戶按下多個鍵時狂巢,每次按鍵都激活一個onmousedown事件撑毛。如果用戶首先按下左鍵,則onmousedown事件激活唧领,event.button屬性值為1藻雌;如果此時按下右鍵,那么onmousedown事件再次發(fā)生斩个,但event.button屬性值為3胯杭。如果腳本同時按下兩個按鍵執(zhí)行特殊動作,那么就應該忽略單一按鍵動作受啥,因為在處理過程中很可能激活單鍵事件做个,從而干擾目標行為。

button屬性僅用于onmousedown滚局、onmouseup和onmousemove事件居暖。對于其他事件,無論鼠標狀態(tài)如何藤肢,都返回0(如onclick)太闺;

例子:在頁面中的任何位置單擊鼠標右鍵都彈窗“你點擊右鍵了”的對話框,單擊“確定”按鈕后將進入到明日科技網(wǎng)站的首頁嘁圈。代碼如下:

<script>
    function gosite(){
        if(event.button == 2){
            alert('你點擊右鍵了');
            window.open('http://www.baidu.com/');
            return false;
        }
    }
    document.onmousedown = gosite;
</script>

(5)clientX屬性
該屬性獲取鼠標在瀏覽器窗口中的X坐標省骂,它是一個只讀屬性蟀淮,即只能獲取鼠標的當前位置,不能改變鼠標的位置钞澳。
語法:

[window.]event.clientX

(6)clientY屬性
該屬性獲取鼠標在瀏覽器窗口中的Y坐標怠惶,它是一個只讀屬性,即只能獲取鼠標的當前位置略贮,不能改變鼠標的位置甚疟。
語法:

[window.]event.clientY

(7)X屬性
該屬性設置或獲取鼠標指針位置相對于css屬性中有position屬性的上級元素的X軸坐標。如果css屬性中沒有position屬性的上級元素逃延,默認以body元素作為參考對象览妖。
語法:

[window.]event.X

如果鼠標事件觸發(fā)后,鼠標移出窗口外揽祥,則返回的值為-1讽膏。這是個只讀屬性,只能通過它獲取鼠標的當前位置拄丰,但不能用它來更改鼠標的位置府树。
(8)Y屬性
該屬性設置或獲取鼠標指針位置相對于css屬性中有position屬性的上級元素的Y軸坐標。如果css屬性中沒有position屬性的上級元素料按,默認以body元素作為參考對象奄侠。
語法:

[window.]event.Y

如果鼠標事件觸發(fā)后,鼠標移出窗口外载矿,則返回的值為-1垄潮。這是個只讀屬性,只能通過它獲取鼠標的當前位置闷盔,但不能用它來更改鼠標的位置弯洗。
(9)cancelBubble屬性
該屬性檢測是否接受上層元素的事件的控制。如果該屬性的值是false逢勾,則允許被上層元素的事件控制牡整;否則值為true,則不被上層元素的事件控制溺拱。
語法:

[window.]event.cancelBubble[=cancelBubble]

(10)srcElement屬性
該屬性設置或獲取觸發(fā)事件的對象逃贝。srcElement屬性是事件初始目標的HTML元素對象引用。由于事件通過元素容器層次進行處理盟迟,且可以在任何一個層次進行處理秋泳,因此由一個屬性指向產生初始事件的元素是很有幫助的。
語法:

[window.]event.srcElement

通過該屬性可以讀攒菠、寫屬于該元素的屬性,并調用它的任何方法歉闰。


真燒腦~~
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末辖众,一起剝皮案震驚了整個濱河市卓起,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌凹炸,老刑警劉巖戏阅,帶你破解...
    沈念sama閱讀 216,651評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異啤它,居然都是意外死亡奕筐,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,468評論 3 392
  • 文/潘曉璐 我一進店門变骡,熙熙樓的掌柜王于貴愁眉苦臉地迎上來离赫,“玉大人,你說我怎么就攤上這事塌碌≡ㄐ兀” “怎么了?”我有些...
    開封第一講書人閱讀 162,931評論 0 353
  • 文/不壞的土叔 我叫張陵台妆,是天一觀的道長翎猛。 經常有香客問我,道長接剩,這世上最難降的妖魔是什么切厘? 我笑而不...
    開封第一講書人閱讀 58,218評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮懊缺,結果婚禮上疫稿,老公的妹妹穿的比我還像新娘。我一直安慰自己桐汤,他們只是感情好而克,可當我...
    茶點故事閱讀 67,234評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著怔毛,像睡著了一般员萍。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上拣度,一...
    開封第一講書人閱讀 51,198評論 1 299
  • 那天碎绎,我揣著相機與錄音,去河邊找鬼抗果。 笑死筋帖,一個胖子當著我的面吹牛,可吹牛的內容都是我干的冤馏。 我是一名探鬼主播日麸,決...
    沈念sama閱讀 40,084評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了代箭?” 一聲冷哼從身側響起墩划,我...
    開封第一講書人閱讀 38,926評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎嗡综,沒想到半個月后乙帮,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經...
    沈念sama閱讀 45,341評論 1 311
  • 正文 獨居荒郊野嶺守林人離奇死亡极景,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,563評論 2 333
  • 正文 我和宋清朗相戀三年察净,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片盼樟。...
    茶點故事閱讀 39,731評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡氢卡,死狀恐怖,靈堂內的尸體忽然破棺而出恤批,到底是詐尸還是另有隱情异吻,我是刑警寧澤,帶...
    沈念sama閱讀 35,430評論 5 343
  • 正文 年R本政府宣布喜庞,位于F島的核電站诀浪,受9級特大地震影響,放射性物質發(fā)生泄漏延都。R本人自食惡果不足惜雷猪,卻給世界環(huán)境...
    茶點故事閱讀 41,036評論 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望晰房。 院中可真熱鬧求摇,春花似錦、人聲如沸殊者。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,676評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽丽旅。三九已至讼溺,卻和暖如春沽损,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背洪乍。 一陣腳步聲響...
    開封第一講書人閱讀 32,829評論 1 269
  • 我被黑心中介騙來泰國打工狭瞎, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留今瀑,地道東北人党窜。 一個月前我還...
    沈念sama閱讀 47,743評論 2 368
  • 正文 我出身青樓拗引,卻偏偏與公主長得像,于是被迫代替她去往敵國和親幌衣。 傳聞我的和親對象是個殘疾皇子矾削,可洞房花燭夜當晚...
    茶點故事閱讀 44,629評論 2 354

推薦閱讀更多精彩內容