Javascript 如何在鼠标移动时从当前鼠标位置获取最近的定位点

我试过了，但我只能在一个段落中找到第一个链接 但是我想找到鼠标位置附近的链接，你可以使用 并创建某种jQuery插件

首先，要查看正在运行的代码，请检查

下面代码的示例用法：

    $('p').on('mousemove',function(event) {
      link = $(event.target).find('a');
      //to find the nearest link and store in the link variable
     console.log(link.html());//to print the link in console
     });

但是下面的代码只是用提供的距离选中元素周围的框。如果它没有返回任何元素，您可以进一步使用它，并选中元素周围的复选框，距离为20px，然后是30px，依此类推。这取决于你的需要

$("p").nearest("a", 10);

$.fn.nearest=函数（选择器，半径）{
var position=this.offset（）；
如果（！radius）radius=10；//像素
var头寸=[]；
var元素=[]；
//因此，向上和向左移动半径变量的值（假设为10）
//从元素的-10-10px角开始，一直移动到
//+10+10坐标到元素的右下角
var startX=位置。左侧-半径；
var startY=位置。顶部-半径；
var endX=position.left+this.outerWidth（true）+半径；
var endY=position.top+this.outerHeight（true）+半径；
var头寸=[]；
//创建水平线
// --------------
//你的元素
// --------------
对于（var x=startX；x

您也可以尝试用悬停代替鼠标移动

$.fn.nearest = function(selector, radius) {
    var position = this.offset();

    if (!radius) radius = 10; // pixels

    var positions = [];
    var elements = [];

    // so, move up and left by the value of radius variable (lets say its 10)
    // start from the -10 -10 px corner of the element and move all the way to 
    // +10 +10 coordinats to the right bottom corner of the element
    var startX = position.left - radius;
    var startY = position.top - radius;
    var endX = position.left + this.outerWidth(true) + radius;
    var endY = position.top + this.outerHeight(true) + radius;

    var positions = [];

    // create horizontal lines
    // --------------
    //  your element
    // --------------
    for (var x = startX; x < endX; x++) {
        // creates upper line on the startY coordinate
        positions.push([x, startY]);
        // creates bottom line on the endY coordinate
        positions.push([x, endY]);
    }

    // create the vertical positions
    // |              |
    // | your element |
    // |              |
    for (var y = startY; y < endY; y++) {
        // creates the left line on the startX coordinate
        positions.push([startX, y]);
        // creates the right line on the endX coordinate
        positions.push([endX, y]);
    }

    // so now the positions array contains all the positions around your element with a radius that you provided
    for (var i = 0; i < positions.length; i++) {
        // just loop over the positions, and get every element
        var position = positions[i];
        var x = position[0];
        var y = position[1];

        var element = document.elementFromPoint(x, y);
        // if element matches with selector, save it for the returned array
        if ($(element).is(selector) && elements.indexOf(element) === -1) elements.push(element);
    }

    return $(elements);
}

一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子一些例子

你好
$（'.demo2 a'）.hover（函数（事件）{
link=$（event.target）；
//查找最近的链接并存储在链接变量中
$（“#演示2”）。文本（链接）；
});

没有简单的方法。。。您需要遍历DOM并比较位置。。。您可以尝试

$（event.target）.closest（'a'）

但它不可靠。假设“最近”是指基于鼠标的x/y位置，可以使用

document.elementFromPoint（x，y）然后以螺旋的方式增加x/y，直到碰到锚。虽然我怀疑它会表现得很好，但这些事情经常让我感到惊讶。事实上，比较位置非常快。。。我在一个项目中使用了它，我必须在clickable element下找到所有元素。。。会给我一个密码，但我找不到。。。是几年前的事了。@FlashThunder.closest（'body'）。find（'a'））我甚至试过这样做，但即使我在页面底部，也只能得到第一个锚。谢谢@FlashThunder的更新。我不想写代码来看看它是否可行。这很可能取决于你增加螺旋的速度有多快，链接有多远/你设置了“未找到”的限制有多大。
<p class="demo1">
some examples some examples <a href="https://jsfiddle.net/">anchor1</a> some examples some examples <a href="">anchor1</a>some examples some examples some examples some examples <a href="">anchor1</a>some examples some examples
</p>
<div id="demo2">hi</div>
$('.demo2 a').hover(function (event) {
    link = $(event.target);
    //to find the nearest link and store in the link variable
    $("#demo2").text(link);
        });