15

我正在使用 javascript 和 jquery 为我的网站构建一个拆分测试工具。现在，当光标经过预览框中的元素时，我想为每个要拆分的元素显示一个小悬停菜单。有没有可能做这样的事情？我做了这样的事情

$('body').hover(function(event){
    console.log(event.target.nodeName);
    // to see if it's showing up the element   
});

但它只触发一次。因为我不想使用点击，因为我还想在锚元素上显示菜单我有点迷路

4

5 回答 5

15

如果您使用的是键盘而不是鼠标：不是 jQuery，对于感兴趣的人来说只是纯 JavaScript：

getSelection().getRangeAt(0).commonAncestorContainer.parentNode
于 2015-05-08T22:30:38.303 回答
14

你可以用document.elementFromPoint这个。

var element = document.elementFromPoint(x, y);

例如：

$('body').hover(function(event){
    var el = document.elementFromPoint(event.pageX, event.pageY);
});

文档：https ://developer.mozilla.org/en-US/docs/DOM/document.elementFromPoint

于 2013-01-22T17:19:44.130 回答
12

我相信您想在mousemove这里使用事件而不是hover事件。

$('body').mousemove(function(evt){
    console.log(evt.target);
});

请记住要mousemove极其小心地使用。

在此处查看示例。

于 2013-01-22T17:27:27.523 回答
1

有 3 种方法可以做到这一点：

  1. 像这样的东西：

    $('body').on('mousemove', function() {
 console.log($(':hover').last().attr('name'));
});

  2. 出于调试目的，您可以直接输入 chrome 控制台$(':hover').last() ，而不是将鼠标悬停在您想要的位置，然后按 Enter 运行此控制台命令。

  3. 如果你想不断地使用它，我建议不要使用 mousemove 事件。使用类似的东西

    $('.one_of_your_trigger_element').on('mouseenter', function() {
 var hover_element = $(':hover').last();
 ...
});
于 2016-08-05T15:13:51.907 回答
0

试试下面的编码，它会帮助你...

    <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>
于 2013-01-22T17:38:59.167 回答