防止在elementFromPoint上触发mousemove

Question

演示:http://jsfiddle.net/2FWZD/

这是jsfiddle代码,因为它迫使我添加代码:

$(document).ready(function () {
    $('.test').on('mousemove', function (e) {
        counter++;
        $('.counter').text(counter);

        $(this).hide();
        // Comment out the following line and counter will stop increasing
        document.elementFromPoint(e.clientX, e.clientY);
        $(this).show();
    });
});

这种情况发生在chrome中,无论如何都要阻止这个或者替代elementFromPoint的方法？

此处详细说明了错误:https://code.google.com/p/chromium/issues/detail？id = 333623

---

编辑1:

我只是想注意,虽然答案是jsfiddle演示的一个砍刀黑客它实际上并没有解决我的根本问题.

我正在使用Leap Motion在网站上模拟鼠标,该网站发送模拟的mousedown和mouseup事件以及mousemoves.我使用画布将光标绘制在所有内容的顶部,并使用此处显示的技术访问画布下方的元素.这样做的鼠标移动是在REAL鼠标位置触发而不是我的模拟鼠标,有效地给了我奇怪的问题.

这对FireFox来说不是问题.

---

编辑2:

问题解决.见答案.使用hide()之外的其他隐藏方法似乎无需触发即可工作

Answer 1

保持最后的位置,如下所示:

var counter = 0;
var last='';
$(document).ready(function () {
    $('.test').on('mousemove', function (e) {
        var cur=e.screenX+':'+e.screenY;
        if (cur == last) return;
        last = cur;
        counter++;
        $('.counter').text(counter);

        $(this).hide();
        // Comment out the following line and counter will stop increasing
        document.elementFromPoint(e.clientX, e.clientY);
        $(this).show();
    });
});

其他方式似乎是通过使用css使其"隐形"来隐藏元素:

var counter = 0;

$(document).ready(function () {
    $('.test').on('mousemove', function (e) {
        counter++;
        $('.counter').text(counter);

        $(this).addClass('hidden');
        // Comment out the following line and counter will stop increasing
        console.log(document.elementFromPoint(e.clientX, e.clientY));
        $(this).removeClass('hidden');
    });
});

CSS:

.test.hidden {
    overflow: hidden;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
}

http://jsfiddle.net/2FWZD/10/