jquery 获取光标所在的元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14464293/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery get element where the cursor is
提问by Johnny000
I'm building a splittesting tool for my website with javascript and jquery. Now I want to show for each elements I want to splittest a little hovermenu when the cursor passes over the element in my previewbox. Is there any possibility to do something like this ? I treid something like this
我正在使用 javascript 和 jquery 为我的网站构建一个拆分测试工具。现在，当光标经过预览框中的元素时，我想为每个我想要拆分的元素显示一个小悬停菜单。有没有可能做这样的事情？我喜欢这样的东西
$('body').hover(function(event){
console.log(event.target.nodeName);
// to see if it's showing up the element
});
but it's only triggering once. As I don't want to use click since I want also to showup the menu on anchor elements I'm a bit lost
但它只触发一次。因为我不想使用单击，因为我还想在锚元素上显示菜单，所以我有点迷茫
采纳答案by Alexander
I believe you want to use the mousemoveevent here instead of the hoverevent.
我相信你想在mousemove这里使用事件而不是hover事件。
$('body').mousemove(function(evt){
console.log(evt.target);
});
Just remember to use mousemovewith extreme caution.
请记住要mousemove极其谨慎地使用。
回答by techfoobar
You can use document.elementFromPointfor this.
您可以document.elementFromPoint为此使用。
var element = document.elementFromPoint(x, y);
For ex:
例如：
$('body').hover(function(event){
var el = document.elementFromPoint(event.pageX, event.pageY);
});
Docs: https://developer.mozilla.org/en-US/docs/DOM/document.elementFromPoint
文档：https: //developer.mozilla.org/en-US/docs/DOM/document.elementFromPoint
回答by Stephani Alves
If you are using the keyboard and not the mouse: Not jQuery, just plain JavaScript for those who are interested:
如果您使用的是键盘而不是鼠标：不是 jQuery，对于那些有兴趣的人来说，只是普通的 JavaScript：
getSelection().getRangeAt(0).commonAncestorContainer.parentNode
回答by Serge Gordeev
There are 3 ways to do so:
有3种方法可以做到：
Something like that:
$('body').on('mousemove', function() { console.log($(':hover').last().attr('name')); });For debugging purpose you can jush type in chrome console
$(':hover').last()Than hover mouse where you want and press Enter to run this console command.If you want to use it constatly, I recommend not to use mousemove event. Use something like that
$('.one_of_your_trigger_element').on('mouseenter', function() { var hover_element = $(':hover').last(); ... });
类似的东西：
$('body').on('mousemove', function() { console.log($(':hover').last().attr('name')); });出于调试目的，您可以在 chrome 控制台中
$(':hover').last()输入而不是将鼠标悬停在您想要的位置，然后按 Enter 以运行此控制台命令。如果你想一直使用它，我建议不要使用 mousemove 事件。使用类似的东西
$('.one_of_your_trigger_element').on('mouseenter', function() { var hover_element = $(':hover').last(); ... });
回答by Pandian
Try the below coding it will help you...
试试下面的编码，它会帮助你...
<body onMouseMove="javaScript:mouseEventHandler(event);">
<script>
function mouseEventHandler(mEvent) {
// Internet Explorer
alert(mEvent.srcElement.nodeName); //Display Node Name
alert(mEvent.srcElement.id); //Display Element ID
//FireFox
alert(mEvent.target.nodeName);//Display Node Name
alert(mEvent.target.id);//Display Element ID
}
</script>
