2017-08-29 137 views
0

有没有什么方法可以确定当鼠标移动到没有css光标样式设置的标准html元素上时,鼠标的样式或图标?例如,鼠标图标位于标准html按钮上时,会从箭头变为手形,或者当它位于标准文本输入上时,会从箭头变为文本输入图标。有什么办法在标准html元素上获取鼠标/光标图标

此代码仅适用于元素具有style.cursor设置。

document.addEventListener("mousemove", function(event) { 
    //console.log("mouse is down") 
    var x = event.clientX, y = event.clientY, 
    elementMouseIsOver = document.elementFromPoint(x, y); 
    console.log("element="+elementMouseIsOver+" cursor="+elementMouseIsOver.style.cursor) 
    }) 

是否有另一种方法来获得标准html项目的鼠标图标?

+0

您是否尝试过的getComputedStyle'()'? (从您的mousemove事件侦听器中调用,以便光标实际上是您当时想知道的形状。) – nnnnnn

+0

这实际上很棒!非常感谢。 – techdog

回答

0

一个技巧可能是这样的:

var currentCursor = undefined; 
$('*').mouseenter(function(){ 
    currentCursor = $(this).css('cursor') ; 
}); 

使用或不使用JQuery是:

var currentCursor = undefined; 
addEventListener('mouseenter', function(e) { 
    if (e.target instanceof HTMLAnchorElement) { 
     currentCursor = e.target.style.cursor; 
    } 
}); 
+0

*“除非另有一个框架/库的另一个标签也包含在内,否则预计会得到一个纯粹的JavaScript答案。”* - 从悬停时显示的[info](https://stackoverflow.com/tags/javascript/info)将鼠标悬停在“javascript”标签上。 (但是如果你觉得你必须推荐一个依赖于图书馆的解决方案,至少应该提及哪个库。) – nnnnnn