javascript event對象

參考文獻(1):http://hqmank.blog.bokee.net/bloggermodule/blog_viewblog.do?id=236780

event代表事件的狀態,例如觸發event對象的元素、鼠標的位置及狀態、按下的鍵等等。
event對象只在事件發生的過程中才有效。
event的某些屬性只對特定的事件有意義。比如,fromElement 和 toElement 屬性只對 onmouseover 和 onmouseout 事件有意義。
例子

下面的例子檢查鼠標是否在鏈接上單擊,並且,如果shift鍵被按下,就取消鏈接的跳轉。
code<HTML>
<HEAD><TITLE>Cancels Links</TITLE>
<SCRIPT LANGUAGE="JScript">
function cancelLink() {
    if (window.event.srcElement.tagName == "A" && window.event.shiftKey)
    window.event.returnValue = false;
}
</SCRIPT>
<BODY οnclick="cancelLink()">


下面的例子在狀態欄上顯示鼠標的當前位置。
code<BODY οnmοusemοve="window.status = 'X=' + window.event.x + ' Y=' + window.event.y">


屬性:

altKey, button, cancelBubble, clientX, clientY, ctrlKey, fromElement, keyCode, offsetX, offsetY, propertyName, returnValue, screenX,
screenY, shiftKey, srcElement, srcFilter, toElement, type, x, y

1.altKey
描述:
檢查alt鍵的狀態。

語法:
event.altKey

可能的值:
當alt鍵按下時,值爲 TRUE ,否則爲 FALSE 。只讀。


2.button
描述:
檢查按下的鼠標鍵。

語法:
event.button

可能的值:
0 沒按鍵
1 按左鍵
2 按右鍵
3 按左右鍵
4 按中間鍵
5 按左鍵和中間鍵
6 按右鍵和中間鍵
7 按所有的鍵

這個屬性僅用於onmousedown, onmouseup, 和 onmousemove 事件。對其他事件,不管鼠標狀態如何,都返回 0(比如onclick)。

3.cancelBubble
描述:
檢測是否接受上層元素的事件的控制。

語法:
event.cancelBubble[ = cancelBubble]

可能的值:
這是一個可讀寫的布爾值:

TRUE 不被上層原素的事件控制。
FALSE 允許被上層元素的事件控制。這是默認值。

例子:
下面的代碼片斷演示了當在圖片上點擊(onclick)時,如果同時shift鍵也被按下,就取消上層元素(body)上的事件onclick所引發的showSrc()函數。

code<SCRIPT LANGUAGE="JScript">
function checkCancel() {
    if (window.event.shiftKey)
    window.event.cancelBubble = true;
}
function showSrc() {
    if (window.event.srcElement.tagName == "IMG")
    alert(window.event.srcElement.src);
}
</SCRIPT>
<BODY οnclick="showSrc()">
<IMG οnclick="checkCancel()" SRC="sample.gif">

 

4.clientX
描述:
返回鼠標在窗口客戶區域中的X座標。

語法:
event.clientX

註釋:
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。


5.clientY
描述:
返回鼠標在窗口客戶區域中的Y座標。

語法:
event.clientY

註釋:
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。


6.ctrlKey
描述:
檢查ctrl鍵的狀態。

語法:
event.ctrlKey

可能的值:
當ctrl鍵按下時,值爲 TRUE ,否則爲 FALSE 。只讀。


7.fromElement
描述:
檢測 onmouseover 和 onmouseout 事件發生時,鼠標所離開的元素。 參考:18.toElement

語法:
event.fromElement

註釋:
這是個只讀屬性。


8.keyCode
描述:
檢測鍵盤事件相對應的內碼。
這個屬性用於 onkeydown, onkeyup, 和 onkeypress 事件。

語法:
event.keyCode[ = keyCode]


可能的值:
這是個可讀寫的值,可以是任何一個Unicode鍵盤內碼。如果沒有引發鍵盤事件,則該值爲 0 。


9.offsetX
描述:
檢查相對於觸發事件的對象,鼠標位置的水平座標

語法:
event.offsetX


10.offsetY
描述:
檢查相對於觸發事件的對象,鼠標位置的垂直座標

語法:
event.offsetY


11.propertyName
描述:
設置或返回元素的變化了的屬性的名稱。

語法:
event.propertyName [ = sProperty ]

可能的值:
sProperty 是一個字符串,指定或返回觸發事件的元素在事件中變化了的屬性的名稱。
這個屬性是可讀寫的。無默認值。

註釋:
你可以通過使用 onpropertychange 事件,得到 propertyName 的值。

例子:
下面的例子通過使用 onpropertychange 事件,彈出一個對話框,顯示 propertyName 的值。

code<HEAD>
<SCRIPT>
function changeProp(){
    btnProp.value = "This is the new VALUE";
}

function changeCSSProp(){
    btnStyleProp.style.backgroundColor = "aqua";
}
</SCRIPT>
</HEAD>
<BODY>
<P>The event object property propertyName is
used here to return which property has been
altered.</P>

<INPUT TYPE=button ID=btnProp οnclick="changeProp()"
VALUE="Click to change the VALUE property of this button"
onpropertychange='alert(event.propertyName+" property has changed value")'>
<INPUT TYPE=button ID=btnStyleProp
οnclick="changeCSSProp()"
VALUE="Click to change the CSS backgroundColor property of this button"
onpropertychange='alert(event.propertyName+" property has changed value")'>
</BODY>

 

12.returnValue
描述:
設置或檢查從事件中返回的值

語法:
event.returnValue[ = Boolean]

可能的值:
true 事件中的值被返回
false 源對象上事件的默認操作被取消

例子見本文的開頭。


13.screenX
描述:
檢測鼠標相對於用戶屏幕的水平位置

語法:
event.screenX


註釋:
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。


14.screenY
描述:
檢測鼠標相對於用戶屏幕的垂直位置

語法:
event.screenY

註釋:
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。


15.shiftKey
描述:
檢查shift鍵的狀態。

語法:
event.shiftKey

可能的值:
當shift鍵按下時,值爲 TRUE ,否則爲 FALSE 。只讀。


16.srcElement
描述:
返回觸發事件的元素。只讀。例子見本文開頭。

語法:
event.srcElement


17.srcFilter
描述:
返回觸發 onfilterchange 事件的濾鏡。只讀。

語法:
event.srcFilter


18.toElement
描述:
檢測 onmouseover 和 onmouseout 事件發生時,鼠標所進入的元素。 參考:7.fromElement

語法:
event.toElement

註釋:
這是個只讀屬性。

例子:下面的代碼演示了當鼠標移到按鈕上時,彈出一個對話框,顯示“mouse arrived”

code<SCRIPT>
function testMouse(oObject) {
    if(oObject.contains(event.toElement)) {
        alert("mouse arrived");
    }
}
</SCRIPT>
:
<BUTTON ID=oButton οnmοuseοver="testMouse(this)">Mouse Over This.</BUTTON>

 

19.type
描述:
返回事件名。

語法:
event.type

註釋:
返回沒有“on”作爲前綴的事件名,比如,onclick事件返回的type是click
只讀。


20. x
描述:
返回鼠標相對於css屬性中有position屬性的上級元素的x軸座標。如果沒有css屬性中有position屬性的上級元素,默認以BODY元素作爲參考對象。

語法:
event.x

註釋:
如果事件觸發後,鼠標移出窗口外,則返回的值爲 -1
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。


21. y
描述:
返回鼠標相對於css屬性中有position屬性的上級元素的y軸座標。如果沒有css屬性中有position屬性的上級元素,默認以BODY元素作爲參考對象。

語法:
event.y

註釋:
如果事件觸發後,鼠標移出窗口外,則返回的值爲 -1
這是個只讀屬性。這意味着,你只能通過它來得到鼠標的當前位置,卻不能用它來更改鼠標的位置。



 參考文獻2:http://blog.csdn.net/EndAll/archive/2006/12/22/1453054.aspx

Javascript的Event對象用來描述Javascript的事件,它主要作用於IE4和NN4以後的各個瀏覽器版本中。Event代表事件狀 態,如事件發生的元素,鍵盤狀態,鼠標位置和鼠標按鈕狀態。一旦事件發生,便會生成Event對象,如單擊一個按鈕,瀏覽器的內存中就產生相應的 event對象。

  IE對事件的引用

  在IE4以上版本中,event對象作爲window屬性訪問:window.envent。其中引用的window部分是可選的.因此腳本就像全局引用一樣來對待event對象:

  event.propertyName

  evnet對象成員表:

  下面的表格列出了 event 對象引出的成員。請單擊左側的標籤來選擇你想要查看的成員類型。

對象
dataTransfer 提供了對於預定義的剪貼板格式的訪問,以便在拖曳操作中使用。

集合
bookmarks 返回捆綁到當前事件所影響的行上的 ActiveX&reg; 數據對象(ADO)書籤的集合。
boundElements 返回頁面上所有綁定到給定數據集的所有元素的集合。

屬性
Abstract 使用 event 對象獲取高級流重定向器(ASX)文件中項目橫幅的 Abstract 內容。
altKey 設置或獲取 Alt 鍵的狀態。
altLeft 設置或獲取左 Alt 鍵的狀態。
Banner 使用 event 對象獲取高級流重定向器(ASX)文件中項目的 Banner 內容。
button 設置或獲取用戶所按的鼠標按鈕。
cancelBubble 設置或獲取當前事件是否要在事件句柄中向上冒泡。
clientX 設置或獲取鼠標指針位置相對於窗口客戶區域的 x 座標,其中客戶區域不包括窗口自身的控件和滾動條。
clientY 設置或獲取鼠標指針位置相對於窗口客戶區域的 y 座標,其中客戶區域不包括窗口自身的控件和滾動條。
contentOverflow 獲取表明文檔處理當前 LayoutRect 對象後是否包含附加的內容。
ctrlKey 設置或獲取 Ctrl 鍵的狀態。
ctrlLeft 設置或獲取左 Ctrl 鍵的狀態。
dataFld 設置或獲取 oncellchange 事件影響的數據列。
fromElement 設置或獲取事件發生時激活或鼠標將要離開的對象。
keyCode 設置或獲取與導致事件的按鍵關聯的 Unicode 按鍵代碼。
MoreInfo 通過 event 對象獲取高級流重定向器(ASX)文件中項目橫幅的 MoreInfo 內容。
nextPage 獲取打印模板中下頁的位置。
offsetX 設置或獲取鼠標指針位置相對於觸發事件的對象的 x 座標。
offsetY 設置或獲取鼠標指針位置相對於觸發事件的對象的 y 座標。
propertyName 設置或獲取對象上發生更改的屬性名稱。
qualifier 設置或獲取由數據源對象提供的數據成員的名稱。
reason 設置或獲取數據源對象的數據傳輸結果。
recordset 從數據源對象設置或獲取對默認數據集的引用。
repeat 獲取 onkeydown 事件是否正在重複。
returnValue 設置或獲取事件的返回值。
saveType 當 oncontentsave 觸發時獲取剪貼板類型。
screenX 設置或獲取獲取鼠標指針位置相對於用戶屏幕的 x 座標。
screenY 設置或獲取鼠標指針位置相對於用戶屏幕的 y 座標。
shiftKey 設置或獲取 Shift 鍵的狀態。
shiftLeft 設置或獲取左 Shift 鍵的狀態。
srcElement 設置或獲取觸發事件的對象。
srcFilter 設置或獲取觸發 onfilterchange 事件的濾鏡對象。
srcUrn 獲取觸發事件的行爲的統一資源名稱(URN)。
toElement 設置或獲取用戶要將鼠標指針移動指向的對象的引用。
type 從 event 對象中獲取事件名稱。
wheelDelta 設置或獲取滾輪按鈕滾動的距離和方向。
x 設置或獲取鼠標指針位置相對於父文檔的 x 像素座標。
y 設置或獲取鼠標指針位置相對於父文檔的 y 像素座標。


註釋

event 對象僅在事件中可用──這意味着,你可以在事件句柄中使用該對象,但不能在其它代碼中使用。

儘管所有事件屬性都可通過所有的 event 對象訪問,但是在某些事件中某些屬性可能無意義。例如,fromElement 和 toElement 屬性僅當處理 onmouseover 和 onmouseout 事件時有意義。

在 Microsoft Visual Basic&reg; 腳本版本(VBScript)中,你必須通過 window 對象訪問 event 對象。

此對象在 Microsoft&reg; Internet Explorer 4.0 的腳本中可用。

示例

下面的例子使用了 event 對象來決定用戶單擊的位置是否在鏈接上,並且避免在 SHIFT 鍵按下時導航到鏈接。

<HTML>
<HEAD><TITLE>取消鏈接</TITLE>
<SCRIPT LANGUAGE="JScript">
function cancelLink() {
if (window.event.srcElement.tagName == "A" && window.event.shiftKey)
window.event.returnValue = false;
}
</SCRIPT>
<BODY οnclick="cancelLink()">

要使Event對象各個屬性或方法都能實現,應選擇IE5.5以上版本。

發佈了51 篇原創文章 · 獲贊 5 · 訪問量 21萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章