2010-04-25 69 views
4

沒有人知道我可以在鼠標懸停後獲取任何元素的ID嗎?鼠標懸停時獲取任何標籤的ID

我想在鼠標結束的元素(標籤)上顯示div(框)。 我無法修改標籤以包含mousover事件。我想要一個全局回調或者類似的東西來獲得鼠標指針下標籤的id。

謝謝!

+0

你可能不在意被徘徊的元素的ID。如果你需要知道元素的ID,你可能只想訪問元素 – Gareth 2010-04-25 01:34:17

+0

你完全正確的Gareth。對鼠標懸停事件的任何回調都會很好。 我該如何做到這一點? – oimoim 2010-04-25 10:54:49

回答

9

你的意思是你想要的onmouseover事件的target,這樣你就可以訪問該元素的屬性:

<script> 
document.onmouseover = function(e) { 
    console.log(e.target.id); 
} 
</script> 

看看Event Properties一個跨瀏覽器的方式來獲得目標(以下示例來自上述網站):

function doSomething(e) { 
    var targ; 
    if (!e) var e = window.event; 
    if (e.target) targ = e.target; 
    else if (e.srcElement) targ = e.srcElement; 
    if (targ.nodeType == 3) // defeat Safari bug 
     targ = targ.parentNode; 
} 

所以要把壽se together:

document.onmouseover = function(e) { 
    var targ; 
    if (!e) var e = window.event; 
    if (e.target) targ = e.target; 
    else if (e.srcElement) targ = e.srcElement; 
    if (targ.nodeType == 3) // defeat Safari bug 
     targ = targ.parentNode; 
    console.log(targ.id); 
} 
+0

哇!這似乎是它! console.log是我正在尋找的功能。 讓我試試:) 謝謝! – oimoim 2010-04-25 10:59:28

+0

我的意思是e.srcElement – oimoim 2010-04-25 21:15:11

0
+0

這確實是一段很好的代碼。但Karim79提供的解決方案更像它。 我知道你發佈這個是因爲我的問題描述不正確。 (我確實需要訪問元素本身)。 感謝您的幫助。 – oimoim 2010-04-25 11:02:16

0

可能不是你要找的。但是如果您使用Firefox的Web開發人員工具,則可以選擇信息 - >顯示ID和課程詳細信息。這將顯示頁面上每個元素的ID和類信息。同樣,使用CSS - >查看樣式信息將允許您將鼠標懸停在元素上,並將鼠標懸停在它們上方時分別顯示其類和ID層次結構。我只提供這種解決方案,因爲我認爲你不希望用戶可以使用這些功能,而是作爲調試網站的工具。

+0

感謝您的回答Kibbee,但我確實希望向用戶提供此功能。當檢查元素時,螢火蟲擴展程序完全做到這一點,但我需要能夠在不擴展的情況下執行此操作。 謝謝。 – oimoim 2010-04-25 10:56:56